Feat: Use memo to wrap canvas nodes to improve fluency #3221 (#7929)

### What problem does this PR solve?

Feat: Use memo to wrap canvas nodes to improve fluency #3221

### Type of change


- [x] New Feature (non-breaking change which adds functionality)

web/src/pages/agent/canvas/node/retrieval-node.tsx

@@ -6,12 +6,12 @@ import { Handle, NodeProps, Position } from '@xyflow/react';
 import { Avatar, Flex } from 'antd';
 import classNames from 'classnames';
 import { get } from 'lodash';
-import { useMemo } from 'react';
+import { memo, useMemo } from 'react';
 import { LeftHandleStyle, RightHandleStyle } from './handle-icon';
 import styles from './index.less';
 import NodeHeader from './node-header';
 
-export function RetrievalNode({
+function InnerRetrievalNode({
   id,
   data,
   isConnectable = true,
@@ -86,3 +86,5 @@ export function RetrievalNode({
     </section>
   );
 }
+
+export const RetrievalNode = memo(InnerRetrievalNode);