Improve chat performance (#6157)

* fix worklet funcs on gestures

* don't access .value in render

3 files changed, 8 insertions, 9 deletions

diff --git a/src/components/dms/ActionsWrapper.tsx b/src/components/dms/ActionsWrapper.tsx
index 9b06bd0b2..b77516e7b 100644
--- a/src/components/dms/ActionsWrapper.tsx
+++ b/src/components/dms/ActionsWrapper.tsx
@@ -53,9 +53,11 @@ export function ActionsWrapper({
     .numberOfTaps(2)
     .hitSlop(HITSLOP_10)
     .onEnd(open)
+    .runOnJS(true)
 
   const pressAndHoldGesture = Gesture.LongPress()
     .onStart(() => {
+      'worklet'
       scale.value = withTiming(1.05, {duration: 200}, finished => {
         if (!finished) return
         runOnJS(open)()
@@ -65,7 +67,6 @@ export function ActionsWrapper({
     .onTouchesUp(shrink)
     .onTouchesMove(shrink)
     .cancelsTouchesInView(false)
-    .runOnJS(true)
 
   const composedGestures = Gesture.Exclusive(
     doubleTapGesture,
diff --git a/src/screens/Messages/Conversation.tsx b/src/screens/Messages/Conversation.tsx
index 651915738..e2e646a3d 100644
--- a/src/screens/Messages/Conversation.tsx
+++ b/src/screens/Messages/Conversation.tsx
@@ -127,9 +127,7 @@ function Inner() {
             setHasScrolled={setHasScrolled}
           />
         ) : (
-          <>
-            <View style={[a.align_center, a.gap_sm, a.flex_1]} />
-          </>
+          <View style={[a.align_center, a.gap_sm, a.flex_1]} />
         )}
         {!readyToShow && (
           <View
diff --git a/src/screens/Messages/components/MessagesList.tsx b/src/screens/Messages/components/MessagesList.tsx
index f549b8560..9db4f07b6 100644
--- a/src/screens/Messages/components/MessagesList.tsx
+++ b/src/screens/Messages/components/MessagesList.tsx
@@ -202,9 +202,9 @@ export function MessagesList({
       convoState.items.length,
       // these are stable
       flatListRef,
-      isAtTop.value,
-      isAtBottom.value,
-      layoutHeight.value,
+      isAtTop,
+      isAtBottom,
+      layoutHeight,
     ],
   )
 
@@ -212,7 +212,7 @@ export function MessagesList({
     if (hasScrolled && prevContentHeight.current > layoutHeight.value) {
       convoState.fetchMessageHistory()
     }
-  }, [convoState, hasScrolled, layoutHeight.value])
+  }, [convoState, hasScrolled, layoutHeight])
 
   const onScroll = React.useCallback(
     (e: ReanimatedScrollEvent) => {
@@ -374,7 +374,7 @@ export function MessagesList({
     },
     [
       flatListRef,
-      keyboardIsOpening.value,
+      keyboardIsOpening,
       layoutScrollWithoutAnimation,
       layoutHeight,
     ],