You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
hyperstream makes it easy to chain
HTML transforms together. I was too lazy to write my own parser + selector so
hence it being a stream. Also I use streams for this stuff anyway so it would
make a lot of sense to keep it as a stream.
Why does it inline all CSS used on a page?
Ideally we'd only inline the "above the fold" CSS, but that requires knowing
which tokens are "above the fold". This would require looking at a specific
viewport, and checking which tokens are used (e.g. headless chrome or similar).
We opted for a slightly simpler option, which hopefully works out well enough
for most cases.
Why doesn't it inline my fancy selectors?
Inlining fancy selectors (e.g. .foo:not(:first-child)) is really hard to
determine statically if it's used. The best way to do so would be to launch a
headless chrome instance - but that requires a fair amount of compute
resources. So we don't. If you want that behavior, we recommend writing a
headless chrome module specifically for that (and let us know, we'd be
interested in that!)
API
transformStream = inline(css)
Create a transform stream that inlines critical CSS in HTML.
