refactor: preact v1 #95

pivanov · 2024-12-09T06:54:44Z

🎯 V1 (WIP)

Changes

Restructured toolbar layout for better UX
Optimized resize performance with debounced updates
Added smooth animations for toolbar transitions
Improved props container positioning and width handling

Performance Improvements

Debounced resize operations to reduce layout thrashing
Optimized animation transitions
Improved DOM manipulation efficiency

Technical Implementation

Shadow DOM encapsulation for styles and scripts isolation
Tailwind
SVG sprite system for optimized icon loading

Bundle Size Optimization 📦

Reduced total bundle size from 3.4MB to 2.3MB (-32%)
Optimized individual bundles:
- monitor/index.js: 124KB → 89KB (-28%)
- params/remix.global.js: 432KB → 256KB (-41%)
- params/next.global.js: 246KB → 149KB (-39%)
- Main bundles: 116KB → 85KB (-27%)

Technical Improvements

Enhanced tree-shaking configuration
Enabled production minification
Optimized dependency externalization
Improved code splitting strategy

These optimizations result in faster load times and better runtime performance while maintaining full functionality. 🥳

vercel · 2024-12-09T06:54:50Z

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
react-scan	❌ Failed (Inspect)			Dec 12, 2024 3:23am

vercel · 2024-12-09T06:54:51Z

@pivanov is attempting to deploy a commit to the Million Team on Vercel.

A member of the Team first needs to authorize it.

pivanov · 2024-12-09T19:11:05Z

Also, I found that the rerender counter wasn't working before this PR.
So dc005a8 fix it 🚀

Before fix:

After fix:

packages/scan/src/core/web/assets/css/styles.tailwind.css

packages/scan/src/core/web/components/icon/index.tsx

packages/scan/tsup.config.ts

packages/extension/src/content/graph.ts

packages/scan/src/core/web/utils/outline.ts

RobPruzan · 2024-12-12T23:32:55Z

I get

TypeError: Cannot read properties of undefined (reading '__H')
    at __H (node_modules/.pnpm/[email protected]/node_modules/preact/hooks/src/index.js:148:18)
    at getHookState (node_modules/.pnpm/[email protected]/node_modules/preact/hooks/src/index.js:281:15)
    at ye (node_modules/.pnpm/react-scan@file+..+pivanov+react-scan+packages+scan+react-scan-0.0.48.tgz_next@15.0.4_@babel+_7rcfaor4b4hxpynt5fowhl3g3m/node_modules/react-scan/dist/core/monitor/params/next.mjs:30:14466)
  146 |         // * https://codesandbox.io/s/mnox05qp8
  147 |         const hooks =
> 148 |                 currentComponent.__hooks ||
      |                                ^
  149 |                 (currentComponent.__hooks = {
  150 |                         _list: [],
  151 |                         _pendingEffects: []
TypeError: Cannot read properties of undefined (reading '__H')

when trying to run the branch

aidenybai · 2024-12-15T02:01:06Z

packages/scan/src/core/web/components/widget/toolbar.tsx

+      return;
+
+    const focusedDomElement = currentState.focusedDomElement;
+    const allElements = Array.from(document.querySelectorAll('*')).filter(


this is a pretty expensive operation

yeah .. this was from the original implementation I will fix it we have also other issues with prev and next buttons

bin/certs/cert.pem

bin/certs/key.pem

packages/scan/src/cli.mts

RobPruzan · 2024-12-15T23:14:51Z

when running on next.js, from:
var signalWidget = signal2((() => {
const stored = readLocalStorage(LOCALSTORAGE_KEY);
const maxWidth = window.innerWidth - SAFE_AREA * 2;
const maxHeight = window.innerHeight - SAFE_AREA * 2;

RobPruzan · 2024-12-15T23:19:14Z

hover style applied to wrong element

RobPruzan · 2024-12-15T23:36:59Z

Okay i think i get why the animation feels choppy, the text rendering behavior is a bit off. It kinda just appears arbitrarily during the animation.

I think it would look smooth if its always rendered, and just overflowed hidden on the way up

also, this overflow shouldn't happen

packages/scan/src/core/index.ts

packages/scan/src/core/web/assets/svgs/svgs.ts

pivanov · 2024-12-16T10:13:17Z

All bugs was fixed (I hope so)

pivanov requested a review from aidenybai December 9, 2024 06:54

vercel bot deployed to Preview December 9, 2024 06:55 View deployment

pivanov force-pushed the refactor/preact branch from 22f6706 to b845197 Compare December 9, 2024 07:13

vercel bot deployed to Preview December 9, 2024 07:14 View deployment

pivanov force-pushed the refactor/preact branch from b845197 to d185971 Compare December 9, 2024 07:31

vercel bot deployed to Preview December 9, 2024 07:32 View deployment

RobPruzan force-pushed the main branch from 22ddf2d to c3b1b85 Compare December 9, 2024 10:28

pivanov force-pushed the refactor/preact branch from d185971 to 14f1c94 Compare December 9, 2024 11:31

vercel bot deployed to Preview December 9, 2024 11:32 View deployment

vercel bot deployed to Preview December 9, 2024 19:08 View deployment

pivanov force-pushed the refactor/preact branch from dc005a8 to 143e3d4 Compare December 9, 2024 20:45

vercel bot deployed to Preview December 9, 2024 20:46 View deployment

vercel bot deployed to Preview December 9, 2024 22:03 View deployment

pivanov commented Dec 9, 2024

View reviewed changes

packages/scan/src/core/web/assets/css/styles.tailwind.css Show resolved Hide resolved

vercel bot deployed to Preview December 10, 2024 00:51 View deployment

vercel bot deployed to Preview December 10, 2024 02:57 View deployment

lxsmnsyc reviewed Dec 10, 2024

View reviewed changes

packages/scan/src/core/web/components/icon/index.tsx Show resolved Hide resolved

RobPruzan reviewed Dec 10, 2024

View reviewed changes

packages/scan/tsup.config.ts Outdated Show resolved Hide resolved

pivanov force-pushed the refactor/preact branch from 66076ed to e0da14a Compare December 11, 2024 02:02

vercel bot deployed to Preview December 11, 2024 02:03 View deployment

vercel bot deployed to Preview December 11, 2024 02:36 View deployment

pivanov force-pushed the refactor/preact branch from dc4e931 to c6e03bd Compare December 12, 2024 03:03

vercel bot deployed to Preview December 12, 2024 03:04 View deployment

chore: a lot of things ...

f105806

pivanov force-pushed the refactor/preact branch from c6e03bd to f105806 Compare December 12, 2024 03:05

vercel bot had a problem deploying to Preview December 12, 2024 03:06 Failure

vercel bot had a problem deploying to Preview December 12, 2024 03:20 Failure

pivanov force-pushed the refactor/preact branch from fcd72be to 565cbae Compare December 12, 2024 19:49

RobPruzan reviewed Dec 12, 2024

View reviewed changes

packages/extension/src/content/graph.ts Outdated Show resolved Hide resolved

RobPruzan reviewed Dec 12, 2024

View reviewed changes

packages/scan/src/core/web/utils/outline.ts Outdated Show resolved Hide resolved

pivanov added 2 commits December 14, 2024 01:25

refactor: D&D and resize, and fix a lot of small bugs

7036f37

Merge remote-tracking branch 'upstream/main' into refactor/preact

1f96a68

pivanov force-pushed the refactor/preact branch from 55d6733 to 1f96a68 Compare December 13, 2024 23:25

pivanov added 2 commits December 14, 2024 01:29

resolve some comments

d46dc7a

improve text rendering

dbf8f77

aidenybai reviewed Dec 15, 2024

View reviewed changes

bin/certs/cert.pem Outdated Show resolved Hide resolved

aidenybai reviewed Dec 15, 2024

View reviewed changes

bin/certs/key.pem Outdated Show resolved Hide resolved

aidenybai reviewed Dec 15, 2024

View reviewed changes

packages/scan/src/cli.mts Outdated Show resolved Hide resolved

prepare for merge

277a978

pivanov force-pushed the refactor/preact branch from 24a7715 to 277a978 Compare December 15, 2024 08:14

pivanov requested a review from aidenybai December 15, 2024 08:16

aidenybai reviewed Dec 16, 2024

View reviewed changes

packages/scan/src/core/index.ts Show resolved Hide resolved

aidenybai reviewed Dec 16, 2024

View reviewed changes

packages/scan/src/core/web/assets/svgs/svgs.ts Show resolved Hide resolved

pivanov force-pushed the refactor/preact branch from 2692cc7 to 4a5bd53 Compare December 16, 2024 10:11

resolve comments

416f03f

pivanov force-pushed the refactor/preact branch from 4a5bd53 to 416f03f Compare December 16, 2024 11:15

pivanov added 4 commits December 16, 2024 14:19

Merge remote-tracking branch 'upstream/main' into refactor/preact

3264f1a

fix: eslint

8774f09

Merge remote-tracking branch 'upstream/main' into refactor/preact

70cbb00

Merge remote-tracking branch 'upstream/main' into refactor/preact

dfb42b4

pivanov merged commit 882c87e into aidenybai:main Dec 16, 2024
2 of 3 checks passed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

refactor: preact v1 #95

refactor: preact v1 #95

pivanov commented Dec 9, 2024 •

edited

Loading

vercel bot commented Dec 9, 2024 •

edited

Loading

vercel bot commented Dec 9, 2024

pivanov commented Dec 9, 2024

RobPruzan commented Dec 12, 2024

aidenybai Dec 15, 2024

pivanov Dec 15, 2024

RobPruzan commented Dec 15, 2024

RobPruzan commented Dec 15, 2024

RobPruzan commented Dec 15, 2024

pivanov commented Dec 16, 2024

refactor: preact v1 #95

refactor: preact v1 #95

Conversation

pivanov commented Dec 9, 2024 • edited Loading

🎯 V1 (WIP)

Changes

Performance Improvements

Technical Implementation

Bundle Size Optimization 📦

Technical Improvements

vercel bot commented Dec 9, 2024 • edited Loading

vercel bot commented Dec 9, 2024

pivanov commented Dec 9, 2024

RobPruzan commented Dec 12, 2024

aidenybai Dec 15, 2024

Choose a reason for hiding this comment

pivanov Dec 15, 2024

Choose a reason for hiding this comment

RobPruzan commented Dec 15, 2024

RobPruzan commented Dec 15, 2024

RobPruzan commented Dec 15, 2024

pivanov commented Dec 16, 2024

pivanov commented Dec 9, 2024 •

edited

Loading

vercel bot commented Dec 9, 2024 •

edited

Loading