addyosmani / addyosmani/critical

Mismatch in computed styles after critical

Ouverte
#541 6 commentaires 0 réactions 0 personnes assignées Voir sur GitHub
awaiting reply
Langage dominant
JavaScript
Étoiles
10.3k
Forks
390
Métriques de merge des PR
Aucune PR mergée en 30 j

Description

After using critical, there's a mismatch in the computed styles:

![Screenshot from 2022-08-05 16-31-36](https://user-images.githubusercontent.com/7604623/183099006-9e34cf62-6269-4fd9-93cf-545ecb1818ac.png)

[Without critical](https://pwapp-24858.web.app/dash), and [with critical](https://pwapp-24858.web.app/critical)

If you patiently inspect the styles, you see there's a mismatch in the computed styles, especially `border-radius`

I tried to [fix the issue](https://github.com/espoal/pwapp/blob/main/libs/critical/index.mjs) by using `forceInclude` to no avail. It seems that when splitting the styles, the `uncritical.css` gets precedence over the inlined styles.

Btw: Amazing project. I took a commercial dashboard, whose load time was around 10 second, and I brought it to 2 seconds with a lot of work (ssr, lazy load, minification...) and then to 0.8 seconds with critical. This npm had by far the most impact, with the least amount of work, it should be advertised everywhere.

Guide de contribution

Ouvrir le guide de contribution

Évaluation

Cette issue n'a pas encore été évaluée.

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.