MirrorSave
/
budibase
mirror of https://github.com/Budibase/budibase.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Use requestAnimationFrame for DND overlay placeholder updates to further improve performance

This commit is contained in:
Andrew Kingston 2022-10-17 08:48:32 +01:00
parent 0378e06550
commit 8c1c84e9aa
1 changed files with 17 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
packages/client/src/components/preview/DNDPlaceholderOverlay.svelte
View File

@ -1,24 +1,27 @@
<script> <script>
import { onMount } from "svelte" import { onMount } from "svelte"
import { DNDPlaceholderID } from "constants" import { DNDPlaceholderID } from "constants"
import { domDebounce } from "utils/domDebounce.js"
let left, top, height, width let left, top, height, width
onMount(() => { const updatePosition = () => {
const interval = setInterval(() => { const node = document.getElementById(DNDPlaceholderID)
const node = document.getElementById(DNDPlaceholderID) if (!node) {
if (!node) { height = 0
height = 0 width = 0
width = 0 } else {
} else { const bounds = node.getBoundingClientRect()
const bounds = node.getBoundingClientRect() left = bounds.left
left = bounds.left top = bounds.top
top = bounds.top height = bounds.height
height = bounds.height width = bounds.width
width = bounds.width }
} }
}, 100) const debouncedUpdate = domDebounce(updatePosition)
onMount(() => {
const interval = setInterval(debouncedUpdate, 100)
return () => { return () => {
clearInterval(interval) clearInterval(interval)
} }