Fix perf issue in collaboration section of landing page

[ShoeBoom]

Summary

I Noticed the https://www.sim.ai/#collaboration section in the landing page has performance problems, cursor is very laggy. I initially tried to fix the current RAF implementation but the cursor still felt very floaty. Switched to a css transform based implementation and it feels much better

fixed with RAF (incase you want the RAF based version): main...ShoeBoom:sim-fix:53a577f6c386eb91ffce69e39532a5864570b7a6

Also changed cursor hiding logic from js based style={{ cursor: isHovering ? 'none' : 'auto' }} to tailwind's hover:cursor-none

Type of Change

• Bug fix
• New feature
• Breaking change
• Documentation
• Other: ___________

Testing

Tested landing page using dev server

Also tested with 4x performance slowdown on m3 mac and it works fine

Checklist

• Code follows project style guidelines
• Self-reviewed my changes
• Tests added/updated and passing
• No new warnings introduced
• I confirm that I have read and agree to the terms outlined in the Contributor License Agreement (CLA)

Screenshots/Videos

Screen.Recording.2026-03-24.at.7.16.07.AM.stripped.mov

[vercel]

@ShoeBoom is attempting to deploy a commit to the Sim Team on Vercel.

A member of the Team first needs to authorize it.

[greptile-apps]

Greptile Summary

This PR fixes a performance issue in the landing page collaboration section by replacing a React-state-driven lerp/RAF cursor animation with a direct DOM mutation approach. On every mousemove, cursorRef.current.style.transform is updated imperatively, completely bypassing React's virtual DOM diffing and eliminating per-frame re-renders. The YouCursor element is kept permanently in the DOM (toggled with hidden instead of conditional rendering) and given will-change-transform so the browser promotes it to its own compositor layer.

Key changes:

• Removed the requestAnimationFrame loop and useEffect that drove setCursorPos on every frame.
• YouCursorProps now accepts a cursorRef instead of x/y coordinates, making the cursor position a pure DOM side-effect rather than React state.
• isHovering state is retained only to toggle visibility (hidden class), so section enter/leave still triggers a single re-render — the hot path (mouse move) is now zero-render.
• Native cursor hiding switched from style={{ cursor: isHovering ? 'none' : 'auto' }} to Tailwind's hover:cursor-none, which is CSS-only and more responsive.
• The prior review concern about will-change-transform on YouCursor has been addressed in the latest commit.

Confidence Score: 5/5

• Safe to merge — clean, focused performance fix with no new logic complexity or regressions.
• The change is small and scoped to one component. The approach (direct DOM mutation + will-change-transform) is idiomatic for this type of cursor tracking, the previous reviewer concern about will-change-transform was addressed, and there are no correctness or security issues. The isHovering state is preserved to avoid a flash of cursor at (0,0) on enter.
• No files require special attention.

Important Files Changed

Filename	Overview
apps/sim/app/(home)/components/collaboration/collaboration.tsx	Replaces the lerp/RAF state-driven cursor animation with direct DOM mutation via style.transform, removing the continuous animation loop, eliminating per-frame React re-renders, and adding will-change-transform to the YouCursor element for compositor layer promotion.

Flowchart

%%{init: {'theme': 'neutral'}}%%
flowchart TD
    A[Mouse enters section] --> B[handleMouseEnter]
    B --> C[Set cursorRef.current.style.transform\n translate clientX-2, clientY-2]
    C --> D[setIsHovering true]
    D --> E[React re-render\n removes hidden class from YouCursor]

    F[Mouse moves inside section] --> G[handleMouseMove]
    G --> H[Set cursorRef.current.style.transform\n translate clientX-2, clientY-2\n NO React re-render]

    I[Mouse leaves section] --> J[handleMouseLeave]
    J --> K[setIsHovering false]
    K --> L[React re-render\n adds hidden class to YouCursor]

    style H fill:#2d6a4f,color:#fff
    style C fill:#2d6a4f,color:#fff

Loading

_{Reviews (3): Last reviewed commit: "remove transition-transform" | Re-trigger Greptile}

[waleedlatif1]

@greptile

[waleedlatif1]

@cursor review

[cursor]

PR Summary

Low Risk
Low risk UI-only change that replaces a requestAnimationFrame state-driven cursor animation with direct DOM transform updates; main risk is minor cursor positioning/visibility regressions across browsers.

Overview
Improves the landing page #collaboration hover cursor performance by removing the React state + requestAnimationFrame lerp loop and instead updating the cursor element via a ref with style.transform on mouse events.

Cursor visibility/hiding is simplified: the section now uses Tailwind hover:cursor-none, and the YouCursor component toggles with hidden rather than conditional rendering and per-frame left/top updates.

^{Written by Cursor Bugbot for commit 8258b93. Configure here.}

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
docs	Ready	Preview, Comment	Mar 24, 2026 4:49pm

[cursor]

Cursor Bugbot has reviewed your changes and found 1 potential issue.

^{Bugbot Autofix is kicking off a free cloud agent to fix this issue. This run is complimentary, but you can enable autofix for all future PRs in the Cursor dashboard.}

[ShoeBoom]

@greptile

[adithyaakrishna]

@ShoeBoom I feel it makes the 'You' cursor feel like a real multiplayer cursor w network latency and w/o it it's just a reskinned pointer

CC @waleedlatif1

[ShoeBoom]

@ShoeBoom I feel it makes the 'You' cursor feel like a real multiplayer cursor w network latency and w/o it it's just a reskinned pointer

technically the 'You' cursor should be client authoritative so it should feel instant, either way right now it just gives the impression that the collaborative mode is really buggy. I have a m3 macbook which is fairly fast, but the cursor teleports every 1s.

If you want to simulate a slight laggy experience, you can either add a throttle function similar to tanstack pacer (and add back transition-transform) or restore some of the use effect logic but fix the infinite loop

PS: I also noticed while reading this file that the other player cursors are also bugged, seems like they are meant to move but dont