So I have been using gatsby-plugin-emotion without knowing the existence of this plugin. When I use gatsby-plugin-material-ui, it does solve the layout shifts on various components (e.g. those using :first-child). Yet, the Lighthouse score takes a big hit. I got significantly lower FCP, LCP, and Speed Index scores.
And I'm not sure what's the cause of the performance it. Is it because of the CacheProvider?
So I have been using
gatsby-plugin-emotionwithout knowing the existence of this plugin. When I usegatsby-plugin-material-ui, it does solve the layout shifts on various components (e.g. those using:first-child). Yet, the Lighthouse score takes a big hit. I got significantly lower FCP, LCP, and Speed Index scores.And I'm not sure what's the cause of the performance it. Is it because of the
CacheProvider?Stackoverflow question for ref.: https://stackoverflow.com/q/69906974/10579013
May personal site for comparison: Build using gatsby-plugin-material-ui: https://4c73fa3b.mwskwong.pages.dev/ Build using gatsby-plugin-emotion: https://1214827f.mwskwong.pages.dev/