From c9cf88eb5e0315f56816d93f21b23b022b53cf8d Mon Sep 17 00:00:00 2001
From: Evan Simkowitz <esimkowitz@users.noreply.github.com>
Date: Thu, 27 Jun 2024 14:36:58 -0700
Subject: [PATCH] Use translate3d for layout transforms to trick browser into
 using GPU acceleration (#85)

---
 frontend/faraday/lib/utils.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/faraday/lib/utils.ts b/frontend/faraday/lib/utils.ts
index d6c6f0fb1..7cc6a4224 100644
--- a/frontend/faraday/lib/utils.ts
+++ b/frontend/faraday/lib/utils.ts
@@ -83,7 +83,7 @@ export function determineDropDirection(dimensions?: Dimensions, offset?: XYCoord
 
 export function setTransform({ top, left, width, height }: Dimensions, setSize: boolean = true): CSSProperties {
     // Replace unitless items with px
-    const translate = `translate(${left}px,${top}px)`;
+    const translate = `translate3d(${left}px,${top}px, 0)`;
     return {
         top: 0,
         left: 0,