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

21
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 { coordinateMapper } from '../../helpers/coordinateMapper';
@@ -14,16 +14,15 @@ const HighlighterComponent = ({ unmodifiedRect, displayedSelector = '', width, h
if (!unmodifiedRect) {
return null;
} else {
const mappedRect = coordinateMapper.mapBrowserRectToCanvas(unmodifiedRect);
const rect = {
top: mappedRect.top + canvasRect.top + window.scrollY,
left: mappedRect.left + canvasRect.left + window.scrollX,
right: mappedRect.right + canvasRect.left,
bottom: mappedRect.bottom + canvasRect.top,
width: mappedRect.width,
height: mappedRect.height,
};
const rect = useMemo(() => {
const mappedRect = coordinateMapper.mapBrowserRectToCanvas(unmodifiedRect);
return {
top: mappedRect.top + canvasRect.top + window.scrollY,
left: mappedRect.left + canvasRect.left + window.scrollX,
width: mappedRect.width,
height: mappedRect.height,
};
}, [unmodifiedRect, canvasRect.top, canvasRect.left]);
return (