vodorod/parcer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: memoize highlighter rect calc

Browse Source
This commit is contained in:
Rohit
2025-06-12 14:15:57 +05:30
parent 50575d90e7
commit 7c5f88cf0e
1 changed files with 10 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
src/components/recorder/Highlighter.tsx
View File

@@ -1,4 +1,4 @@
import React from 'react'; import React, { useMemo } from 'react';
import styled from "styled-components"; import styled from "styled-components";
import { coordinateMapper } from '../../helpers/coordinateMapper'; import { coordinateMapper } from '../../helpers/coordinateMapper';
@@ -14,16 +14,15 @@ const HighlighterComponent = ({ unmodifiedRect, displayedSelector = '', width, h
if (!unmodifiedRect) { if (!unmodifiedRect) {
return null; return null;
} else { } else {
const rect = useMemo(() => {
const mappedRect = coordinateMapper.mapBrowserRectToCanvas(unmodifiedRect); const mappedRect = coordinateMapper.mapBrowserRectToCanvas(unmodifiedRect);
return {
const rect = {
top: mappedRect.top + canvasRect.top + window.scrollY, top: mappedRect.top + canvasRect.top + window.scrollY,
left: mappedRect.left + canvasRect.left + window.scrollX, left: mappedRect.left + canvasRect.left + window.scrollX,
right: mappedRect.right + canvasRect.left,
bottom: mappedRect.bottom + canvasRect.top,
width: mappedRect.width, width: mappedRect.width,
height: mappedRect.height, height: mappedRect.height,
}; };
}, [unmodifiedRect, canvasRect.top, canvasRect.left]);
return ( return (