0–49 50–89 90–100
Metrics
Total Blocking Time
170 ms
Sum of all time periods between FCP and Time to Interactive, when task length exceeded 50ms, expressed in milliseconds. Learn more about the Total Blocking Time metric.
Cumulative Layout Shift
0.102
Cumulative Layout Shift measures the movement of visible elements within the viewport. Learn more about the Cumulative Layout Shift metric.
Interaction to Next Paint
60 ms
Interaction to Next Paint measures page responsiveness, how long it takes the page to visibly respond to user input. Learn more about the Interaction to Next Paint metric.
Show audits relevant to:
Diagnostics
Avoid large layout shifts 1 layout shift found
These are the largest layout shifts observed on the page. Each table item represents a single layout shift, and shows the element that shifted the most. Below each item are possible root causes that led to the layout shift. Some of these layout shifts may not be included in the CLS metric value due to windowing. Learn how to improve CLSCLS
Element | Layout shift score |
---|---|
Code © 2020-2021 Mike's Cereal Shack Authors
Content © 2005-2013 NBCUniversal M… <footer class="w-full flex flex-row flex-wrap p-2 text-center text-gray-400 sm:text-left …"> | 0.102 |
Image elements do not have explicit width
and height
width
and height
Set an explicit width and height on image elements to reduce layout shifts and improve CLS. Learn how to set image dimensionsCLS
URL | |
---|---|
mikescerealshack.co 1st party | |
Mike's Cereal Shack Co Logo - The Office Meme Creator <img src="/logo-text.svg" class="h-10" alt="Mike's Cereal Shack Co Logo - The Office Meme Creator"> | /logo-text.svg (www.mikescerealshack.co) |
Serve static assets with an efficient cache policy 9 resources found
A long cache lifetime can speed up repeat visits to your page. Learn more about efficient cache policies.
URL | Cache TTL | Transfer Size |
---|---|---|
mikescerealshack.co 1st party | 33 KiB | |
…128w/f5c5012….jpg (cdn.mikescerealshack.co) | 4h | 5 KiB |
…128w/558dc2f….jpg (cdn.mikescerealshack.co) | 4h | 4 KiB |
…128w/5d1df07….jpg (cdn.mikescerealshack.co) | 4h | 4 KiB |
…128w/08b3049….jpg (cdn.mikescerealshack.co) | 4h | 4 KiB |
…128w/5fbc916….jpg (cdn.mikescerealshack.co) | 4h | 4 KiB |
…128w/9b3031e….jpg (cdn.mikescerealshack.co) | 4h | 4 KiB |
…128w/b997cdb….jpg (cdn.mikescerealshack.co) | 4h | 3 KiB |
…128w/81d89db….jpg (cdn.mikescerealshack.co) | 4h | 3 KiB |
…128w/793a408….jpg (cdn.mikescerealshack.co) | 4h | 3 KiB |
Minimizes main-thread work 0.9 s
Consider reducing the time spent parsing, compiling and executing JS. You may find delivering smaller JS payloads helps with this. Learn how to minimize main-thread workTBT
Category | Time Spent |
---|---|
Script Evaluation | 463 ms |
Other | 301 ms |
Style & Layout | 116 ms |
Rendering | 57 ms |
Parse HTML & CSS | 6 ms |
Garbage Collection | 3 ms |
Script Parsing & Compilation | 2 ms |
Avoid long main-thread tasks 1 long task found
Lists the longest tasks on the main thread, useful for identifying worst contributors to input delay. Learn how to avoid long main-thread tasksTBT
URL | Start Time | Duration |
---|---|---|
mikescerealshack.co 1st party | 216 ms | |
1,924 ms | 216 ms |
JavaScript execution time 0.4 s
Consider reducing the time spent parsing, compiling, and executing JS. You may find delivering smaller JS payloads helps with this. Learn how to reduce Javascript execution time.TBT
URL | Total CPU Time | Script Evaluation | Script Parse |
---|---|---|---|
mikescerealshack.co 1st party | 713 ms | 373 ms | 1 ms |
489 ms | 172 ms | 0 ms | |
…chunks/framework.9d52415….js (www.mikescerealshack.co) | 161 ms | 142 ms | 0 ms |
…pages/search-61667db….js (www.mikescerealshack.co) | 63 ms | 59 ms | 1 ms |
Unattributable | 158 ms | 18 ms | 0 ms |
Unattributable | 158 ms | 18 ms | 0 ms |
User Timing marks and measures 5 user timings
Consider instrumenting your app with the User Timing API to measure your app's real-world performance during key user experiences. Learn more about User Timing marks.
Name | Type | Start Time | Duration |
---|---|---|---|
Next.js-route-change-to-render | Measure | 258.40 ms | 602.91 ms |
Next.js-render | Measure | 861.31 ms | 29.61 ms |
routeChange | Mark | 258.40 ms | |
beforeRender | Mark | 861.31 ms | |
afterRender | Mark | 890.92 ms |
Avoids enormous network payloads Total size was 67 KiB
Large network payloads cost users real money and are highly correlated with long load times. Learn how to reduce payload sizes.
URL | Transfer Size |
---|---|
mikescerealshack.co 1st party | 35.2 KiB |
…pages/terms-0236318….js (www.mikescerealshack.co) | 4.7 KiB |
…128w/f5c5012….jpg (cdn.mikescerealshack.co) | 4.5 KiB |
…128w/558dc2f….jpg (cdn.mikescerealshack.co) | 4.1 KiB |
…128w/5d1df07….jpg (cdn.mikescerealshack.co) | 4.0 KiB |
…128w/08b3049….jpg (cdn.mikescerealshack.co) | 3.9 KiB |
…128w/5fbc916….jpg (cdn.mikescerealshack.co) | 3.8 KiB |
…128w/9b3031e….jpg (cdn.mikescerealshack.co) | 3.6 KiB |
…128w/b997cdb….jpg (cdn.mikescerealshack.co) | 3.3 KiB |
…pages/search-61667db….js (www.mikescerealshack.co) | 3.2 KiB |
Algolia utility | 24.7 KiB |
…dev_OFFICE_SCENES/query (mnl4bjjsnz-dsn.algolia.net) | 24.7 KiB |
Minimize third-party usage Third-party code blocked the main thread for 0 ms
Third-party code can significantly impact load performance. Limit the number of redundant third-party providers and try to load third-party code after your page has primarily finished loading. Learn how to minimize third-party impact.TBT
Third-Party | Transfer Size | Main-Thread Blocking Time |
---|---|---|
Algolia utility | 25 KiB | 0 ms |
…dev_OFFICE_SCENES/query (mnl4bjjsnz-dsn.algolia.net) | 25 KiB | 0 ms |
Google Analytics analytics | 0 KiB | 0 ms |
/g/collect?v=… (www.google-analytics.com) | 0 KiB | 0 ms |
/g/collect?v=… (www.google-analytics.com) | 0 KiB | 0 ms |
Minimizes work during key interaction 60 ms spent on event 'mousedown'
This is the thread-blocking work occurring during the Interaction to Next Paint measurement. Learn more about the Interaction to Next Paint metric.INP
Event target |
---|
search <button type="submit" class="bg-white hover:bg-teal-bright py-2 px-4 mr-4 rounded-md uppercase"> |
Phase | Total time | Script evaluation | Style & Layout | Rendering |
---|---|---|---|---|
Input delay | 6 ms | |||
…chunks/framework.9d52415….js (www.mikescerealshack.co) | 3 ms | 3 ms | 0 ms | 0 ms |
2 ms | 1 ms | 0 ms | 0 ms | |
Processing duration | 0 ms | |||
Presentation delay | 50 ms | |||
/gtag/js?id=G-RTW9M3W5HC (www.googletagmanager.com) | 31 ms | 31 ms | 0 ms | 0 ms |
13 ms | 6 ms | 1 ms | 2 ms | |
…chunks/framework.9d52415….js (www.mikescerealshack.co) | 5 ms | 5 ms | 0 ms | 0 ms |
Passed audits (14) Show Hide
Passed audits (14)
Show Hide
Properly size images
Serve images that are appropriately-sized to save cellular data and improve load time. Learn how to size images.
Minify CSS
Minifying CSS files can reduce network payload sizes. Learn how to minify CSS.
Minify JavaScript
Minifying JavaScript files can reduce payload sizes and script parse time. Learn how to minify JavaScript.
Reduce unused JavaScript
Reduce unused JavaScript and defer loading scripts until they are required to decrease bytes consumed by network activity. Learn how to reduce unused JavaScript.
Efficiently encode images
Optimized images load faster and consume less cellular data. Learn how to efficiently encode images.
Serve images in next-gen formats
Image formats like WebP and AVIF often provide better compression than PNG or JPEG, which means faster downloads and less data consumption. Learn more about modern image formats.
Enable text compression
Text-based resources should be served with compression (gzip, deflate or brotli) to minimize total network bytes. Learn more about text compression.
Use video formats for animated content
Large GIFs are inefficient for delivering animated content. Consider using MPEG4/WebM videos for animations and PNG/WebP for static images instead of GIF to save network bytes. Learn more about efficient video formats
Remove duplicate modules in JavaScript bundles
Remove large, duplicate JavaScript modules from bundles to reduce unnecessary bytes consumed by network activity.
Avoid serving legacy JavaScript to modern browsers
Polyfills and transforms enable legacy browsers to use new JavaScript features. However, many aren't necessary for modern browsers. For your bundled JavaScript, adopt a modern script deployment strategy using module/nomodule feature detection to reduce the amount of code shipped to modern browsers, while retaining support for legacy browsers. Learn how to use modern JavaScript
Uses passive listeners to improve scrolling performance
Consider marking your touch and wheel event listeners as
passive
to improve your page's scroll performance. Learn more about adopting passive event listeners. Avoids document.write()
document.write()
For users on slow connections, external scripts dynamically injected via
document.write()
can delay page load by tens of seconds. Learn how to avoid document.write(). Avoid non-composited animations
Animations which are not composited can be janky and increase CLS. Learn how to avoid non-composited animationsCLS
Page didn't prevent back/forward cache restoration
Many navigations are performed by going back to a previous page, or forwards again. The back/forward cache (bfcache) can speed up these return navigations. Learn more about the bfcache
Passed audits (8) Show Hide
Passed audits (8)
Show Hide
Uses HTTPS
All sites should be protected with HTTPS, even ones that don't handle sensitive data. This includes avoiding mixed content, where some resources are loaded over HTTP despite the initial request being served over HTTPS. HTTPS prevents intruders from tampering with or passively listening in on the communications between your app and your users, and is a prerequisite for HTTP/2 and many new web platform APIs. Learn more about HTTPS.
Avoids deprecated APIs
Deprecated APIs will eventually be removed from the browser. Learn more about deprecated APIs.
Avoids third-party cookies
Support for third-party cookies will be removed in a future version of Chrome. Learn more about phasing out third-party cookies.
Displays images with correct aspect ratio
Image display dimensions should match natural aspect ratio. Learn more about image aspect ratio.
Serves images with appropriate resolution
Image natural dimensions should be proportional to the display size and the pixel ratio to maximize image clarity. Learn how to provide responsive images.
No browser errors logged to the console
Errors logged to the console indicate unresolved problems. They can come from network request failures and other browser concerns. Learn more about this errors in console diagnostic audit
No issues in the Issues
panel in Chrome Devtools
Issues
panel in Chrome Devtools Issues logged to the
Issues
panel in Chrome Devtools indicate unresolved problems. They can come from network request failures, insufficient security controls, and other browser concerns. Open up the Issues panel in Chrome DevTools for more details on each issue. Page has valid source maps
Source maps translate minified code to the original source code. This helps developers debug in production. In addition, Lighthouse is able to provide further insights. Consider deploying source maps to take advantage of these benefits. Learn more about source maps.