diff --git a/web/app/components/workflow/run/utils/format-log/index.ts b/web/app/components/workflow/run/utils/format-log/index.ts
index a58cb07ce1..df7947594a 100644
--- a/web/app/components/workflow/run/utils/format-log/index.ts
+++ b/web/app/components/workflow/run/utils/format-log/index.ts
@@ -10,7 +10,7 @@ import { orderBy } from 'lodash-es'
 
 const formatToTracingNodeList = (list: NodeTracing[], t: any) => {
   const allItems = cloneDeep([...list]).sort((a, b) => a.index - b.index)
-  const loopRelatedList = allItems.filter(item => (item.execution_metadata?.loop_id || item.node_type === BlockEnum.Loop))
+  const loopRelatedListIds = allItems.filter(item => (!!item.execution_metadata?.loop_id || item.node_type === BlockEnum.Loop)).map(x => x.id)
   /*
   * First handle not change list structure node
   * Because Handle struct node will put the node in different
@@ -18,9 +18,9 @@ const formatToTracingNodeList = (list: NodeTracing[], t: any) => {
   const formattedAgentList = formatAgentNode(allItems)
   const formattedRetryList = formatRetryNode(formattedAgentList) // retry one node
   // would change the structure of the list. Iteration and parallel can include each other.
-  const formattedIterationList = formatIterationNode(formattedRetryList.filter(item => !loopRelatedList.includes(item)), t)
-  const formattedLoopList = formatLoopNode(loopRelatedList, t)
-  const orderedNodeList = orderBy([...formattedIterationList, ...formattedLoopList], 'index', 'asc')
+  const formattedIterationList = formatIterationNode(formattedRetryList.filter(item => !loopRelatedListIds.includes(item.id)), t)
+  const formattedLoopList = formatLoopNode(formattedRetryList.filter(item => loopRelatedListIds.includes(item.id)), t)
+  const orderedNodeList = orderBy([...formattedIterationList, ...formattedLoopList], 'finished_at', 'asc')
   const formattedParallelList = formatParallelNode(orderedNodeList, t)
 
   const result = formattedParallelList