Skip to content

Prefetch stylesheets #44

@aalin

Description

@aalin

Currently, when a new component renders, it will send the path of its stylesheet in the same patch set as the HTML for the component, which causes the styles to load after the component has been rendered, which causes flashing.

Since all stylesheets are per-component they are usually very small and could easily be prefetched.

It would be nice if it was possible to find all the CSS files for components used on a page so that the files on the current page could load first...

It is probably enough to just use fetch() and let the browser cache the response.

There is also CSS Module Scripts, but this syntax doesn't work in Firefox yet.

await import('/__mayu/static/7OuD0769LzoQV3qjke0rryI9fYFCJYUlpDlKKe9QCJs=.css', { assert: { type: 'css' } })

https://chromestatus.com/feature/5948572598009856

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions