Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Use try/catch for properties instead of an allow list, remove xlink: #2939

Merged
merged 8 commits into from Jan 19, 2021
Merged

Use try/catch for properties instead of an allow list, remove xlink: #2939

merged 8 commits into from Jan 19, 2021

Conversation

developit
Copy link
Member

@developit developit commented Jan 18, 2021 •
edited

This PR includes two fundamental changes to the way we do prop diffing:

  1. Instead of safeguarding against setting read-only reflected DOM properties, it attempts to set the property in a try/catch and falls back to setting an attribute

  2. The codepath for detecting xlink:href / xlinkHref props and applying them via setAttributeNS() is simply removed. This was only ever used for the xlink:href attribute, which was removed from SVG 2. The non-namespaced href attribute works exactly the same way. As a bridging solution, since there are lots of folks using <use xlinkHref="..">, I've retained the code that strips any xlink namespace prefix off of the prop name.

Fixes #2926.

@github-actions
Copy link

github-actions bot commented Jan 18, 2021 •
edited

📊 Tachometer Benchmark Results

Summary

duration

  • 02_replace1k: unsure 🔍 -1% - +1% (-1.47ms - +1.15ms)
    preact-local vs preact-master
  • 03_update10th1k_x16: unsure 🔍 -1% - +6% (-0.42ms - +2.13ms)
    preact-local vs preact-master
  • 07_create10k: unsure 🔍 -5% - +1% (-66.97ms - +19.42ms)
    preact-local vs preact-master
  • filter_list: unsure 🔍 -2% - +1% (-0.50ms - +0.27ms)
    preact-local vs preact-master
  • hydrate1k: unsure 🔍 -0% - +2% (-0.12ms - +2.20ms)
    preact-local vs preact-master
  • many_updates: unsure 🔍 -9% - +5% (-3.73ms - +2.17ms)
    preact-local vs preact-master
  • text_update: unsure 🔍 -3% - +5% (-0.11ms - +0.18ms)
    preact-local vs preact-master

usedJSHeapSize

  • 02_replace1k: unsure 🔍 -0% - +0% (-0.01ms - +0.00ms)
    preact-local vs preact-master
  • 03_update10th1k_x16: unsure 🔍 -0% - +0% (-0.01ms - +0.00ms)
    preact-local vs preact-master
  • 07_create10k: unsure 🔍 -0% - -0% (-0.00ms - -0.00ms)
    preact-local vs preact-master
  • filter_list: unsure 🔍 -0% - -0% (-0.00ms - -0.00ms)
    preact-local vs preact-master
  • hydrate1k: unsure 🔍 -0% - +0% (-0.03ms - +0.01ms)
    preact-local vs preact-master
  • many_updates: unsure 🔍 -0% - +0% (-0.00ms - +0.00ms)
    preact-local vs preact-master
  • text_update: unsure 🔍 -0% - -0% (-0.00ms - -0.00ms)
    preact-local vs preact-master

Results

02_replace1k
  • Browser: chrome-headless 87.0.4280.141
  • Sample size: 80
  • Built by: CI #742

  • Commit: 603ebf7

duration

VersionAvg timevs preact-mastervs preact-local
preact-master146.95ms - 148.94ms-unsure 🔍
-1% - +1%
-1.15ms - +1.47ms
preact-local146.94ms - 148.64msunsure 🔍
-1% - +1%
-1.47ms - +1.15ms		-

usedJSHeapSize

VersionAvg timevs preact-mastervs preact-local
preact-master3.60ms - 3.61ms-unsure 🔍
-0% - +0%
-0.00ms - +0.01ms
preact-local3.60ms - 3.61msunsure 🔍
-0% - +0%
-0.01ms - +0.00ms		-

run-warmup-0

VersionAvg timevs preact-mastervs preact-local
preact-master55.18ms - 57.32ms-unsure 🔍
-1% - +4%
-0.74ms - +2.41ms
preact-local54.25ms - 56.56msunsure 🔍
-4% - +1%
-2.41ms - +0.74ms		-

run-warmup-1

VersionAvg timevs preact-mastervs preact-local
preact-master85.92ms - 87.79ms-slower ❌
0% - 3%
0.26ms - 2.28ms
preact-local85.21ms - 85.97msfaster ✔
0% - 3%
0.26ms - 2.28ms		-

run-warmup-2

VersionAvg timevs preact-mastervs preact-local
preact-master98.23ms - 100.95ms-unsure 🔍
-2% - +2%
-1.85ms - +1.80ms
preact-local98.40ms - 100.84msunsure 🔍
-2% - +2%
-1.80ms - +1.85ms		-

run-warmup-3

VersionAvg timevs preact-mastervs preact-local
preact-master53.98ms - 56.03ms-unsure 🔍
-1% - +4%
-0.43ms - +2.08ms
preact-local53.45ms - 54.90msunsure 🔍
-4% - +1%
-2.08ms - +0.43ms		-

run-warmup-4

VersionAvg timevs preact-mastervs preact-local
preact-master101.15ms - 105.63ms-faster ✔
2% - 6%
1.78ms - 6.97ms
preact-local106.45ms - 109.08msslower ❌
2% - 7%
1.78ms - 6.97ms		-

run-final

VersionAvg timevs preact-mastervs preact-local
preact-master54.06ms - 55.20ms-unsure 🔍
-1% - +2%
-0.53ms - +1.08ms
preact-local53.78ms - 54.92msunsure 🔍
-2% - +1%
-1.08ms - +0.53ms		-
03_update10th1k_x16
  • Browser: chrome-headless 87.0.4280.141
  • Sample size: 120
  • Built by: CI #742

  • Commit: 603ebf7

duration

VersionAvg timevs preact-mastervs preact-local
preact-master34.08ms - 35.85ms-unsure 🔍
-6% - +1%
-2.13ms - +0.42ms
preact-local34.89ms - 36.73msunsure 🔍
-1% - +6%
-0.42ms - +2.13ms		-

usedJSHeapSize

VersionAvg timevs preact-mastervs preact-local
preact-master3.52ms - 3.52ms-unsure 🔍
-0% - +0%
-0.00ms - +0.01ms
preact-local3.52ms - 3.52msunsure 🔍
-0% - +0%
-0.01ms - +0.00ms		-
07_create10k
  • Browser: chrome-headless 87.0.4280.141
  • Sample size: 70
  • Built by: CI #742

  • Commit: 603ebf7

duration

VersionAvg timevs preact-mastervs preact-local
preact-master1373.15ms - 1451.29ms-unsure 🔍
-1% - +5%
-19.42ms - +66.97ms
preact-local1370.02ms - 1406.87msunsure 🔍
-5% - +1%
-66.97ms - +19.42ms		-

usedJSHeapSize

VersionAvg timevs preact-mastervs preact-local
preact-master25.99ms - 25.99ms-unsure 🔍
+0% - +0%
+0.00ms - +0.00ms
preact-local25.99ms - 25.99msunsure 🔍
-0% - -0%
-0.00ms - -0.00ms		-
filter_list
  • Browser: chrome-headless 87.0.4280.141
  • Sample size: 50
  • Built by: CI #742

  • Commit: 603ebf7

duration

VersionAvg timevs preact-mastervs preact-local
preact-master26.21ms - 26.71ms-unsure 🔍
-1% - +2%
-0.27ms - +0.50ms
preact-local26.05ms - 26.63msunsure 🔍
-2% - +1%
-0.50ms - +0.27ms		-

usedJSHeapSize

VersionAvg timevs preact-mastervs preact-local
preact-master1.60ms - 1.60ms-unsure 🔍
+0% - +0%
+0.00ms - +0.00ms
preact-local1.60ms - 1.60msunsure 🔍
-0% - -0%
-0.00ms - -0.00ms		-
hydrate1k
  • Browser: chrome-headless 87.0.4280.141
  • Sample size: 50
  • Built by: CI #742

  • Commit: 603ebf7

duration

VersionAvg timevs preact-mastervs preact-local
preact-master133.88ms - 135.46ms-unsure 🔍
-2% - +0%
-2.20ms - +0.12ms
preact-local134.86ms - 136.55msunsure 🔍
-0% - +2%
-0.12ms - +2.20ms		-

usedJSHeapSize

VersionAvg timevs preact-mastervs preact-local
preact-master6.19ms - 6.22ms-unsure 🔍
-0% - +0%
-0.01ms - +0.03ms
preact-local6.19ms - 6.20msunsure 🔍
-0% - +0%
-0.03ms - +0.01ms		-
many_updates
  • Browser: chrome-headless 87.0.4280.141
  • Sample size: 80
  • Built by: CI #742

  • Commit: 603ebf7

duration

VersionAvg timevs preact-mastervs preact-local
preact-master40.46ms - 44.35ms-unsure 🔍
-5% - +9%
-2.17ms - +3.73ms
preact-local39.40ms - 43.85msunsure 🔍
-9% - +5%
-3.73ms - +2.17ms		-

usedJSHeapSize

VersionAvg timevs preact-mastervs preact-local
preact-master4.85ms - 4.85ms-unsure 🔍
-0% - +0%
-0.00ms - +0.00ms
preact-local4.85ms - 4.85msunsure 🔍
-0% - +0%
-0.00ms - +0.00ms		-
text_update
  • Browser: chrome-headless 87.0.4280.141
  • Sample size: 180
  • Built by: CI #742

  • Commit: 603ebf7

duration

VersionAvg timevs preact-mastervs preact-local
preact-master3.68ms - 3.85ms-unsure 🔍
-5% - +3%
-0.18ms - +0.11ms
preact-local3.68ms - 3.91msunsure 🔍
-3% - +5%
-0.11ms - +0.18ms		-

usedJSHeapSize

VersionAvg timevs preact-mastervs preact-local
preact-master0.83ms - 0.83ms-unsure 🔍
+0% - +0%
+0.00ms - +0.00ms
preact-local0.83ms - 0.83msunsure 🔍
-0% - -0%
-0.00ms - -0.00ms		-

tachometer-reporter-action v2 for CI

@github-actions
Copy link

github-actions bot commented Jan 18, 2021 •
edited

Size Change: -221 B (0%)

Total Size: 42.1 kB

Filename Size Change
dist/preact.js 3.98 kB -56 B (1%)
dist/preact.min.js 4.01 kB -54 B (1%)
dist/preact.module.js 4.01 kB -54 B (1%)
dist/preact.umd.js 4.04 kB -57 B (1%)
ℹ️ View Unchanged
Filename Size Change
compat/dist/compat.js 3.45 kB 0 B
compat/dist/compat.module.js 3.47 kB 0 B
compat/dist/compat.umd.js 3.51 kB 0 B
debug/dist/debug.js 2.99 kB 0 B
debug/dist/debug.module.js 2.98 kB 0 B
debug/dist/debug.umd.js 3.07 kB 0 B
devtools/dist/devtools.js 186 B 0 B
devtools/dist/devtools.module.js 196 B 0 B
devtools/dist/devtools.umd.js 261 B 0 B
hooks/dist/hooks.js 1.13 kB 0 B
hooks/dist/hooks.module.js 1.15 kB 0 B
hooks/dist/hooks.umd.js 1.2 kB 0 B
jsx-runtime/dist/jsxRuntime.js 327 B 0 B
jsx-runtime/dist/jsxRuntime.module.js 335 B 0 B
jsx-runtime/dist/jsxRuntime.umd.js 405 B 0 B
test-utils/dist/testUtils.js 437 B 0 B
test-utils/dist/testUtils.module.js 439 B 0 B
test-utils/dist/testUtils.umd.js 515 B 0 B

compressed-size-action

@marvinhagemeister marvinhagemeister mentioned this pull request Jan 18, 2021
Merged
@developit developit changed the title WIP: use try/catch for property setters instead of an allow list WIP: try/catch for properties instead of an allow list, remove XML namespaces Jan 18, 2021
@developit developit changed the title WIP: try/catch for properties instead of an allow list, remove XML namespaces WIP: try/catch for properties instead of an allow list, remove xlink: code Jan 18, 2021
@developit developit changed the title WIP: try/catch for properties instead of an allow list, remove xlink: code WIP: try/catch for properties instead of an allow list, remove xlink. Jan 18, 2021
@developit developit changed the title WIP: try/catch for properties instead of an allow list, remove xlink. WIP: try/catch for properties instead of an allow list, remove xlink: Jan 18, 2021
@coveralls
Copy link

coveralls commented Jan 18, 2021 •
edited

Coverage Status

Coverage increased (+0.006%) to 99.436% when pulling 051d395 on properties-trycatch into 565928d on master.

@developit developit marked this pull request as ready for review January 18, 2021 22:49
@developit developit changed the title WIP: try/catch for properties instead of an allow list, remove xlink: Use try/catch for properties instead of an allow list, remove xlink: Jan 18, 2021
andrewiggins
andrewiggins reviewed Jan 18, 2021
View reviewed changes
Copy link
Member

@andrewiggins andrewiggins left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is great!! 🙌🎉

src/diff/props.js Outdated Show resolved Hide resolved
src/diff/props.js Outdated Show resolved Hide resolved
developit and others added 3 commits January 18, 2021 21:28
@developit @andrewiggins
Avoid mangling attributeName attribute
3e21164 
Co-authored-by: Andre Wiggins <459878+andrewiggins@users.noreply.github.com>
@developit @andrewiggins
golf aria attribute prefix check
b0f966a 
Co-authored-by: Andre Wiggins <459878+andrewiggins@users.noreply.github.com>
@developit
A few more size optimizations for events (-6b)
015754c
@developit
Copy link
Member Author

I will kick CI again in an hour haha

ForsakenHarmony
ForsakenHarmony reviewed Jan 19, 2021
View reviewed changes
src/diff/props.js
) {
try {
dom[name] = value == null ? '' : value;
// labelled break is 1b smaller here than a return statement (sorry)
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

is that worth it?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think it's fine, given that the comment explains what's happening.

marvinhagemeister
marvinhagemeister approved these changes Jan 19, 2021
View reviewed changes
Copy link
Member

@marvinhagemeister marvinhagemeister left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Fantastic stuff 🙌

@marvinhagemeister marvinhagemeister merged commit 139a862 into master Jan 19, 2021
@marvinhagemeister marvinhagemeister deleted the properties-trycatch branch January 19, 2021 07:52
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@andrewiggins andrewiggins andrewiggins left review comments

@ForsakenHarmony ForsakenHarmony ForsakenHarmony left review comments

@marvinhagemeister marvinhagemeister marvinhagemeister approved these changes

@JoviDeCroock JoviDeCroock JoviDeCroock approved these changes

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

element with contentEditable=undefined crashes in Preact but not React
6 participants
@developit @coveralls @andrewiggins @marvinhagemeister @ForsakenHarmony @JoviDeCroock