Record · corpus.blog/posts/01a0bdd7-3a6f-714c-8ab1-37b5a9f42f84

Style scoping versus shadow DOM: which is fastest?

Nolan Lawson · published 22 June 2022

A record is what was published and who pointed at it. The text of the post is not held here: read it at the source, or at its Wayback capture.

Read the post at nolanlawson.com Wayback capture

1blogs citing

First cited: 23 Dec 2023
Most recent: 23 Dec 2023
Rank this month: not ranked
Links from this post: 61
Words captured: 3,913

Cited by

Blog

In the post

Date

mayank.co

CSS-based state management Read at the source ↗

23 Dec 2023

Links from this post

Link

Host

Does shadow DOM improve style performance? Read at the source ↗

nolanlawson.com

https://web.dev/rendering-performance/

web.dev

https://vuejs.org/api/sfc-css-features.html

vuejs.org

https://svelte.dev/docs

svelte.dev

https://github.com/css-modules/css-modules

github.com

https://github.com/nolanlawson/shadow-selector-benchmark

github.com

https://github.com/vuejs/core/blob/9c304bfe7942a20264235865b4bb5f6e53fdee0d/packages/compiler-sfc/src/stylePluginScoped.ts

github.com

https://sfc.vuejs.org/

sfc.vuejs.org

https://svelte.dev/repl/3530c322d227477c8b23af8258907480?version=3.48.0

svelte.dev

https://calendar.perfplanet.com/2011/css-selector-performance-has-changed-for-the-better/

calendar.perfplanet.com

https://github.com/salesforce/lwc/pull/2329

github.com

https://medium.com/@aigoncharov/edge-hates-you-attributes-d15faf162939

medium.com

https://bugs.webkit.org/show_bug.cgi?id=53880

bugs.webkit.org

https://trac.webkit.org/changeset/229090/webkit

trac.webkit.org

https://bugs.chromium.org/p/chromium/issues/detail?id=1196474

bugs.chromium.org

https://bugzilla.mozilla.org/show_bug.cgi?id=1704551

bugzilla.mozilla.org

https://www.tomsguide.com/news/macbook-pro-m1-benchmarks-are-in-and-they-destroy-intel

tomsguide.com

https://gist.github.com/nolanlawson/07644f13293a3deeb8fcdf0a15a5148b

gist.github.com

More thoughts on SPAs Read at the source ↗

nolanlawson.com

https://www.npmjs.com/package/random-seedable

npmjs.com

https://github.com/WICG/request-post-animation-frame/blob/main/explainer.md

github.com

Accurately measuring layout on the web Read at the source ↗

nolanlawson.com

https://nolanlawson.com/wp-content/uploads/2022/06/screenshot-from-2022-06-19-21-36-46.png

nolanlawson.com

https://hacks.mozilla.org/2017/08/inside-a-super-fast-css-engine-quantum-css-aka-stylo/

hacks.mozilla.org

https://nolanlawson.com/wp-content/uploads/2022/06/screenshot-from-2022-06-19-22-15-01.png

nolanlawson.com

https://nolanlawson.com/wp-content/uploads/2022/06/screenshot-from-2022-06-19-22-17-24-1.png

nolanlawson.com

https://nolanlawson.com/wp-content/uploads/2022/06/screenshot-from-2022-06-19-22-21-52-1.png

nolanlawson.com

https://nolanlawson.com/wp-content/uploads/2022/06/screenshot-from-2022-06-19-22-21-56-1.png

nolanlawson.com

https://nolanlawson.com/wp-content/uploads/2022/06/screenshot-from-2022-06-19-22-22-03-2.png

nolanlawson.com

https://bugs.chromium.org/p/chromium/issues/detail?id=1337599

bugs.chromium.org

https://www.youtube.com/watch?v=3sMflOp5kiQ

youtube.com

https://nolanlawson.com/wp-content/uploads/2022/06/screenshot-from-2022-06-19-22-20-18-2.png

nolanlawson.com

https://web.dev/constructable-stylesheets/

web.dev

https://github.com/nolanlawson/shadow-selector-benchmark/commit/b7ba2e0861d74719fb22aaff9a9a9a7c3e50800e

github.com

https://github.com/WICG/construct-stylesheets/issues/94

github.com

https://github.com/salesforce/lwc/pull/2460

github.com

https://github.com/salesforce/lwc/pull/2683

github.com

https://nolanlawson.com/wp-content/uploads/2022/06/screenshot-from-2022-06-19-22-17-36.png

nolanlawson.com

https://bugs.webkit.org/show_bug.cgi?id=242058

bugs.webkit.org

https://nolanlawson.com/wp-content/uploads/2022/06/screenshot-from-2022-06-19-22-28-08.png

nolanlawson.com

https://drafts.csswg.org/css-cascade-6/

drafts.csswg.org

https://github.com/w3c/csswg-drafts/issues/3547

github.com

https://nolanlawson.github.io/shadow-selector-benchmark

nolanlawson.github.io

https://infrequently.org/

infrequently.org

https://blog.tomayac.com/

blog.tomayac.com

How to write about web performance Read at the source ↗

nolanlawson.com

https://github.com/Polymer/tachometer

github.com

https://nolanlawson.com/wp-content/uploads/2022/06/screenshot-from-2022-06-23-19-30-39.png

nolanlawson.com

https://gist.github.com/nolanlawson/62b3861886179caeb8f00b6819a0daa3

gist.github.com

https://nolanlawson.com/wp-content/uploads/2022/06/screenshot-from-2022-06-25-13-13-55.png

nolanlawson.com

https://gist.github.com/nolanlawson/aaeabb0a801fbfb862047629c15973d9

gist.github.com

https://github.com/nolanlawson/shadow-selector-benchmark/releases/tag/v2

github.com

https://enhance.dev/docs/learn/features/transforms/style-transforms

enhance.dev

https://gist.github.com/nolanlawson/59da2015248ed96b6750a0b4e3a695cc

gist.github.com

https://nolanlawson.com/wp-content/uploads/2022/06/screenshot-from-2022-10-08-09-18-42.png

nolanlawson.com

https://nolanlawson.com/wp-content/uploads/2022/06/screenshot-from-2022-10-08-09-48-52.png

nolanlawson.com

https://github.com/emilio

github.com

https://bugzilla.mozilla.org/show_bug.cgi?id=1728851

bugzilla.mozilla.org

https://nolanlawson.com/wp-content/uploads/2022/06/screenshot-from-2022-10-08-09-18-47.png

nolanlawson.com

https://nolanlawson.com/wp-content/uploads/2022/06/screenshot-from-2022-10-08-09-48-56.png

nolanlawson.com

https://xkcd.com/356/

xkcd.com