addyosmani / addyosmani/critical

Mismatch in computed styles after critical

未關閉
#541 6 則留言 0 個 reaction 已指派 0 人 在 GitHub 檢視
awaiting reply
主要語言
JavaScript
星號
10.3k
分支
390
PR 合併指標
30 天內沒有已合併 PR

描述

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.

貢獻指南

開啟貢獻指南

評估

這個 Issue 還沒有評估資料。

把新 issue 寄到你的電子郵件信箱

精選適合新手參與的 GitHub issue 摘要。