Experiment: split component lifecycle merge types

[developit]

This is an alternative to #3518 that re-unifies component rendering (function and class components taking the same codepath) in order to split apart component mounting vs patching. It may also be possible to keep function/class components split up while also keeping mount/patch separate, but some quick experiments locally seemed to show a fairly major size increase (4 functions with limited similarity, vs 2 similar functions in both main and this PR).

The code here is primarily a refactoring of the v11 code from main, with a few optimizations from vm incorporated. In particular, renderFunctionComponent() and renderClassComponent() were merged into a new patchComponent() method (to match patchElement). It also removes short-circuiting of Text Internals, since we hadn't actually intended to bypass options._diff() and options.diffed() for those.

[github-actions[bot]]

📊 Tachometer Benchmark Results

Summary

duration

• 02_replace1k: unsure 🔍 -1% - +2% (-2.78ms - +3.33ms)
  ^{preact-local vs preact-master}
• 03_update10th1k_x16: slower ❌ 0% - 5% (0.12ms - 2.35ms)
  ^{preact-local vs preact-master}
• 07_create10k: unsure 🔍 -0% - +0% (-4.92ms - +1.29ms)
  ^{preact-local vs preact-master}
• filter_list: unsure 🔍 -5% - +1% (-52.71ms - +15.93ms)
  ^{preact-local vs preact-master}
• hydrate1k: unsure 🔍 -9% - +5% (-11.94ms - +6.05ms)
  ^{preact-local vs preact-master}
• many_updates: unsure 🔍 -6% - +2% (-49.87ms - +20.87ms)
  ^{preact-local vs preact-master}
• text_update: unsure 🔍 -5% - +10% (-16.34ms - +33.98ms)
  ^{preact-local vs preact-master}
• todo: unsure 🔍 -5% - +0% (-2.77ms - +0.31ms)
  ^{preact-local vs preact-master}

usedJSHeapSize

• 02_replace1k: slower ❌ 0% - 1% (0.01ms - 0.03ms)
  ^{preact-local vs preact-master}
• 03_update10th1k_x16: unsure 🔍 -0% - +0% (-0.00ms - +0.00ms)
  ^{preact-local vs preact-master}
• 07_create10k: unsure 🔍 -0% - +0% (-0.03ms - +0.04ms)
  ^{preact-local vs preact-master}
• filter_list: slower ❌ 1% - 1% (0.02ms - 0.03ms)
  ^{preact-local vs preact-master}
• hydrate1k: unsure 🔍 +0% - +0% (+0.00ms - +0.01ms)
  ^{preact-local vs preact-master}
• many_updates: unsure 🔍 -0% - +0% (-0.01ms - +0.01ms)
  ^{preact-local vs preact-master}
• text_update: unsure 🔍 -0% - +0% (-0.00ms - +0.00ms)
  ^{preact-local vs preact-master}
• todo: unsure 🔍 -1% - +2% (-0.01ms - +0.03ms)
  ^{preact-local vs preact-master}

Results

02_replace1k

• Browser: chrome-headless 102.0.5005.61
• Sample size: 80
• Built by: Benchmarks #786

• Commit: 0d75911

duration

Version	Avg time	vs preact-master	vs preact-local
preact-master	186.64ms - 190.97ms	-	unsure 🔍 -2% - +1% -3.33ms - +2.78ms
preact-local	186.93ms - 191.23ms	unsure 🔍 -1% - +2% -2.78ms - +3.33ms	-

usedJSHeapSize

Version	Avg time	vs preact-master	vs preact-local
preact-master	4.16ms - 4.17ms	-	faster ✔ 0% - 1% 0.01ms - 0.03ms
preact-local	4.17ms - 4.19ms	slower ❌ 0% - 1% 0.01ms - 0.03ms	-

run-warmup-0

Version	Avg time	vs preact-master	vs preact-local
preact-master	61.40ms - 63.43ms	-	faster ✔ 0% - 5% 0.27ms - 3.18ms
preact-local	63.09ms - 65.18ms	slower ❌ 0% - 5% 0.27ms - 3.18ms	-

run-warmup-1

Version	Avg time	vs preact-master	vs preact-local
preact-master	85.27ms - 89.20ms	-	slower ❌ 4% - 12% 3.45ms - 9.29ms
preact-local	78.71ms - 83.02ms	faster ✔ 4% - 11% 3.45ms - 9.29ms	-

run-warmup-2

Version	Avg time	vs preact-master	vs preact-local
preact-master	78.87ms - 81.51ms	-	unsure 🔍 -4% - +0% -3.55ms - +0.14ms
preact-local	80.61ms - 83.18ms	unsure 🔍 -0% - +4% -0.14ms - +3.55ms	-

run-final

Version	Avg time	vs preact-master	vs preact-local
preact-master	186.66ms - 191.00ms	-	unsure 🔍 -2% - +1% -3.34ms - +2.76ms
preact-local	186.97ms - 191.27ms	unsure 🔍 -1% - +2% -2.76ms - +3.34ms	-

03_update10th1k_x16

• Browser: chrome-headless 102.0.5005.61
• Sample size: 60
• Built by: Benchmarks #786

• Commit: 0d75911

duration

Version	Avg time	vs preact-master	vs preact-local
preact-master	49.49ms - 50.83ms	-	faster ✔ 0% - 5% 0.12ms - 2.35ms
preact-local	50.51ms - 52.29ms	slower ❌ 0% - 5% 0.12ms - 2.35ms	-

usedJSHeapSize

Version	Avg time	vs preact-master	vs preact-local
preact-master	4.19ms - 4.20ms	-	unsure 🔍 -0% - +0% -0.00ms - +0.00ms
preact-local	4.19ms - 4.19ms	unsure 🔍 -0% - +0% -0.00ms - +0.00ms	-

07_create10k

• Browser: chrome-headless 102.0.5005.61
• Sample size: 50
• Built by: Benchmarks #786

• Commit: 0d75911

duration

Version	Avg time	vs preact-master	vs preact-local
preact-master	1267.99ms - 1272.82ms	-	unsure 🔍 -0% - +0% -1.29ms - +4.92ms
preact-local	1266.64ms - 1270.54ms	unsure 🔍 -0% - +0% -4.92ms - +1.29ms	-

usedJSHeapSize

Version	Avg time	vs preact-master	vs preact-local
preact-master	28.31ms - 28.36ms	-	unsure 🔍 -0% - +0% -0.04ms - +0.03ms
preact-local	28.32ms - 28.36ms	unsure 🔍 -0% - +0% -0.03ms - +0.04ms	-

filter_list

• Browser: chrome-headless 102.0.5005.61
• Sample size: 60
• Built by: Benchmarks #786

• Commit: 0d75911

duration

Version	Avg time	vs preact-master	vs preact-local
preact-master	1093.45ms - 1137.21ms	-	unsure 🔍 -1% - +5% -15.93ms - +52.71ms
preact-local	1070.49ms - 1123.38ms	unsure 🔍 -5% - +1% -52.71ms - +15.93ms	-

usedJSHeapSize

Version	Avg time	vs preact-master	vs preact-local
preact-master	2.10ms - 2.11ms	-	faster ✔ 1% - 1% 0.02ms - 0.03ms
preact-local	2.12ms - 2.14ms	slower ❌ 1% - 1% 0.02ms - 0.03ms	-

hydrate1k

• Browser: chrome-headless 102.0.5005.61
• Sample size: 80
• Built by: Benchmarks #786

• Commit: 0d75911

duration

Version	Avg time	vs preact-master	vs preact-local
preact-master	118.86ms - 131.08ms	-	unsure 🔍 -5% - +10% -6.05ms - +11.94ms
preact-local	115.42ms - 128.63ms	unsure 🔍 -9% - +5% -11.94ms - +6.05ms	-

usedJSHeapSize

Version	Avg time	vs preact-master	vs preact-local
preact-master	6.92ms - 6.92ms	-	unsure 🔍 -0% - -0% -0.01ms - -0.00ms
preact-local	6.92ms - 6.92ms	unsure 🔍 +0% - +0% +0.00ms - +0.01ms	-

many_updates

• Browser: chrome-headless 102.0.5005.61
• Sample size: 70
• Built by: Benchmarks #786

• Commit: 0d75911

duration

Version	Avg time	vs preact-master	vs preact-local
preact-master	841.85ms - 893.47ms	-	unsure 🔍 -2% - +6% -20.87ms - +49.87ms
preact-local	828.97ms - 877.35ms	unsure 🔍 -6% - +2% -49.87ms - +20.87ms	-

usedJSHeapSize

Version	Avg time	vs preact-master	vs preact-local
preact-master	5.73ms - 5.73ms	-	unsure 🔍 -0% - +0% -0.01ms - +0.01ms
preact-local	5.73ms - 5.73ms	unsure 🔍 -0% - +0% -0.01ms - +0.01ms	-

text_update

• Browser: chrome-headless 102.0.5005.61
• Sample size: 80
• Built by: Benchmarks #786

• Commit: 0d75911

duration

Version	Avg time	vs preact-master	vs preact-local
preact-master	332.05ms - 366.39ms	-	unsure 🔍 -9% - +4% -33.98ms - +16.34ms
preact-local	339.65ms - 376.44ms	unsure 🔍 -5% - +10% -16.34ms - +33.98ms	-

usedJSHeapSize

Version	Avg time	vs preact-master	vs preact-local
preact-master	1.31ms - 1.31ms	-	unsure 🔍 -0% - +0% -0.00ms - +0.00ms
preact-local	1.31ms - 1.32ms	unsure 🔍 -0% - +0% -0.00ms - +0.00ms	-

todo

• Browser: chrome-headless 102.0.5005.61
• Sample size: 60
• Built by: Benchmarks #786

• Commit: 0d75911

duration

Version	Avg time	vs preact-master	vs preact-local
preact-master	58.63ms - 61.12ms	-	unsure 🔍 -1% - +5% -0.31ms - +2.77ms
preact-local	57.74ms - 59.55ms	unsure 🔍 -5% - +0% -2.77ms - +0.31ms	-

usedJSHeapSize

Version	Avg time	vs preact-master	vs preact-local
preact-master	1.34ms - 1.37ms	-	unsure 🔍 -2% - +1% -0.03ms - +0.01ms
preact-local	1.34ms - 1.38ms	unsure 🔍 -1% - +2% -0.01ms - +0.03ms	-

_{tachometer-reporter-action v2 for Benchmarks}

[coveralls]

Coverage increased (+0.1%) to 99.571% when pulling 0d759117173da24ee5780124477d981b8b18d535 on experiment-split-component-lifecycle-merge-types into 730604ece33bfc0bf5fce31f72f174b764094fc2 on main.

[github-actions[bot]]

Size Change: -243 B (0%)

Total Size: 38.2 kB

Filename	Size	Change
compat/dist/compat.js	3.62 kB	-9 B (0%)
compat/dist/compat.umd.js	3.7 kB	-10 B (0%)
dist/preact.js	4.61 kB	-86 B (1%)
dist/preact.min.js	4.69 kB	-66 B (1%)
dist/preact.umd.js	4.7 kB	-72 B (1%)

ℹ️ View Unchanged

Filename	Size	Change
debug/dist/debug.js	3.25 kB	0 B
debug/dist/debug.umd.js	3.33 kB	0 B
devtools/dist/devtools.js	232 B	0 B
devtools/dist/devtools.umd.js	316 B	0 B
hooks/dist/hooks.js	1.32 kB	0 B
hooks/dist/hooks.umd.js	1.4 kB	0 B
jsx-runtime/dist/jsxRuntime.js	342 B	0 B
jsx-runtime/dist/jsxRuntime.umd.js	425 B	0 B
server/dist/server.js	2.6 kB	0 B
server/dist/server.umd.js	2.69 kB	0 B
test-utils/dist/testUtils.js	431 B	0 B
test-utils/dist/testUtils.umd.js	516 B	0 B

_{compressed-size-action}