Large Render Blocking Asset /
New Issue
/static/js/main.779fa2a0.js
Large render blocking assets are a type of resource span delaying
First Contentful Paint (FCP). Delaying FCP means it takes more time
to initially load the page for the user. Spans that end after FCP are
not as critical as those that end before it. The resource span may
take form of a script, stylesheet, image, or other asset that
requires optimization. To learn more about how to fix large render
blocking assets, check out these resources:
https://web.dev/fcp/
After having never received this error in Sentry, all of a sudden we have received 20 of these errors over the last day on our app. Our website https://cbbanalytics.com/ doesn't have the fastest loading home-page, but we haven't changed anything major in the last day that would lead to this issue. What is the recommended way to troubleshoot this further to resolve the issue?
Edit: perhaps this issue was recently added to Sentry, which is why we weren't receiving this issue earlier...
Edit2: we are also, suddenly, getting plenty of Uncompressed Asset issues in Sentry as well. Did Sentry just add these both as new issues to be tracked?
Resources and Whatever
Uncompressed assets are asset spans that take over 500ms and are
larger than 512kB which can usually be made faster with compression.
Check that your server or CDN serving your assets is accepting the
content encoding header from the browser and is returning them compressed.
Both of these issues are referencing files /static/js/main..., which leads me to think these issues may be related to our entire web applications build being too large? How can we begin to troubleshoot this?
I don't think this is related to your build size, and it's not something you really want to ignore either.
You can see some specifics using PageSpeed Insights. It's showing your First Contentful Paint at 2.7 seconds, with the largest at 5 seconds, and gives some suggestions. I believe these are measured at a 3G network speed. The page appeared pretty snappy, but once I throttled my speed to fast 3G, it was much more obvious.
You have some big images that are taking a while to load. I noticed a 4.4MB and a 2.5MB image on the landing page that could be significantly reduced. Were these recently added? That might be a minor change behind why Sentry is just now being triggered.
I also noticed there is an absolutely massive amount of data being returned from the api. Insights picked up on this too, and shows 18,227KiB in network payloads. Most of this data doesn't seem to be used on the landing page anywhere. Break out those requests so that they only fire when necessary, and consider paginating them if possible.
I think that will get you well on your way to reducing FCP time and eliminating the sentry error.