Webpage Performance Test Result

WebPageTest ran 12 diagnostic checks related to this category and found 7 opportunities.

1. This test had a reasonably quick first-byte time.

   A fast time to first byte is essential for delivering assets quickly.
2. 2 JavaScript files are blocking page rendering.

   By default, references to external JavaScript files will block the page from rendering while they are fetched and executed. Often, these files can be loaded in a different manner, freeing up the page to visually render sooner.

   • /svg4everybody.min.js
   • /static/js/main.b7ff81bb.js

   Relevant Experiments

   • Defer Render-Blocking Scripts

     This experiment adds a defer attribute to render-blocking scripts, causing the browser to fetch them in parallel while showing the page. Deferred scripts still execute in the order they are defined in source. Example implementation: <script src="/svg4everybody.min.js" defer></script>

     Assets included in experiment:

     1. /svg4everybody.min.js
     2. /static/js/main.b7ff81bb.js
     Run This Experiment!

   • Async Render-Blocking Scripts

     This experiment adds an async attribute to render-blocking scripts, causing the browser to fetch them in parallel while showing the page. Async scripts are not guaranteed to execute in the order they are defined in source. Example implementation: <script src="/svg4everybody.min.js" async></script>

     Assets included in experiment:

     1. /svg4everybody.min.js
     2. /static/js/main.b7ff81bb.js
     Login to WebPageTest to run Pro experiments.

   • Inline Render-Blocking Scripts

     This experiment embeds the contents of specified external scripts directly into the HTML within a script element. This increases the size of the HTML, but can often allow page page to display sooner by avoiding server round trips.Example implementation: <script>/* contents from /svg4everybody.min.js here...*/</script>

     Assets included in experiment:

     1. /svg4everybody.min.js
     2. /static/js/main.b7ff81bb.js
     Login to WebPageTest to run Pro experiments.
3. 1 externally-referenced CSS file is blocking page rendering.

   By default, references to external CSS files will block the page from rendering while they are fetched and executed. Sometimes these files _should_ block rendering, but can be inlined to avoid additional round-trips while the page is waiting to render. Sometimes, such as with stylesheets that are only used for loading custom fonts, inline or async CSS can greatly improve perceived performance.

   • /static/css/main.bc2d3b44.css

   Relevant Experiments

   • Inline external CSS

     This experiment embeds the contents of specified external stylesheets directly into the HTML within a style element. This increases the size of the HTML, but can often allow page page to display sooner by avoiding server round trips. Note: The inline experiment may break relative references to images and other assets in the CSS. These would need proper path changes in production.

     Assets included in experiment:

     1. /static/css/main.bc2d3b44.css
     Login to WebPageTest to run Pro experiments.

   • Load CSS Asynchronously

     This experiment loads specified stylesheets in a way that allows the page to begin rendering while they are still loading. Note that this may cause a flash of unstyled content.

     Assets included in experiment:

     1. /static/css/main.bc2d3b44.css
     Login to WebPageTest to run Pro experiments.
4. Zero render-critical images are lazy-loaded.

   When images are lazy-loaded using loading="lazy", they will be requested after the layout is established, which is too late for images in the critical window.
5. Images outside the critical viewport can be lazy-loaded.

   When images are lazy-loaded using loading="lazy", when they scroll into the viewport, freeing up early load for other tasks.

   • /static/media/logo-mass.4cb33ca7.png
   • /static/media/logo-snap.120de9f3.png

   Relevant Experiments

   • Add loading="lazy" to images

     This experiment adds loading="lazy" attributes to images that are outside the viewport at load.

     Assets included in experiment:

     1. /static/media/logo-mass.4cb33ca7.png
     2. /static/media/logo-snap.120de9f3.png
     Login to WebPageTest to run Pro experiments.
6. Several fonts are loaded with settings that hide text while they are loading.

   When fonts are loaded with default display settings, like font-display="block", browsers will hide text entirely for several seconds instead of showing text with a fallback font.

   • Source Sans Pro 700 normal
   • Source Sans Pro 400 normal

   Relevant Experiments

   • Add font-display: swap

     This experiment adds font-display="swap" to custom fonts to show text sooner.

     Assets included in experiment:
     Login to WebPageTest to run Pro experiments.
7. Zero third-party fonts found.

   Fonts on 3rd party domains may take longer to load due to DNS and connection steps that are not necessary when fonts are hosted on the same domain.
8. Zero unused preloads were found.

   Preloaded resources are fetched at a high priority, delaying the arrival of other resources in the page. In the case where a preloaded resource is never actually used by the page, that means potentially critical requests will be delayed, slowing down the initial loading of your site.
9. 3 files were hosted without using a CDN.

   A Content Delivery Network (CDN) distributes a website's files throughout the world, reducing request latency. These files do not use a CDN:

   • https://dtaconnect.eohhs.mass.gov/svg4everybody.min.js
   • https://dtaconnect.eohhs.mass.gov/static/css/main.bc2d3b44.css
   • https://dtaconnect.eohhs.mass.gov/static/js/main.b7ff81bb.js
10. 8 static files have inadequate cache settings.

    Cache settings can instruct browsers and intermediaries to store recent versions of a site's static files (JavaScript, CSS, Images, fonts...) for reuse, reducing page weight and latency.

    • FAILED (No max-age or expires): https://dtaconnect.eohhs.mass.gov/svg4everybody.min.js
    • FAILED (No max-age or expires): https://dtaconnect.eohhs.mass.gov/static/css/main.bc2d3b44.css
    • FAILED (No max-age or expires): https://dtaconnect.eohhs.mass.gov/static/js/main.b7ff81bb.js
    • WARNING (1.4 hours): https://www.google-analytics.com/analytics.js
    • FAILED (15.0 minutes): https://www.googletagmanager.com/gtag/js?id=G-TYZK686PZ2&cx=c&_slc=1
    • FAILED (15.0 minutes): https://www.googletagmanager.com/gtag/js?id=G-SW2TVH2WBY&cx=c&_slc=1
    • FAILED (15.0 minutes): https://www.googletagmanager.com/gtag/js?id=G-TYZK686PZ2
    • FAILED (15.0 minutes): https://www.googletagmanager.com/gtm.js?id=GTM-PNR87FP
11. Zero requests were found that resulted in an HTTP redirect.

    HTTP redirects can result in additional DNS resolution, TCP connection and HTTPS negotiation times, making them very costly for performance, particularly on high latency networks.
12. Final HTML (DOM) size is significantly larger than initially delivered HTML (24.17kb larger, or 93.67% of total HTML).

    Typically this is due to over-reliance on JavaScript for generating content, but increases can also happen as a result of browsers normalizing HTML structure as well. When critical HTML content is generated with JavaScript in the browser, several performance bottlenecks can arise:

    • Before content can be generated client-side, the browser must first parse, evaluate, and sometimes also request JavaScript over the network. These steps occur after the HTML is initially delivered, and can incur long delays depending on the device.
    • If the generated HTML contains references to external assets (images for example), the browser will not be able to discover and request them as early as desired.

    Relevant Experiments

    • Mimic Pre-rendered HTML

      This experiment mimics server-generated HTML by swapping the initial HTML with the fully rendered HTML from this test run. Note: this will very likely break site behavior, but is potentially useful for comparing early metrics and assessing whether moving logic to the server is worth the effort.

      Assets included in experiment:

      1. 240804_AiDcFG_31Y
      Login to WebPageTest to run Pro experiments.

WebPageTest ran 5 diagnostic checks related to this category and found 1 opportunities.

1. Zero major layout shifts detected.

   This is great. Layout shifts hinder usability and reducing layout shifts will improve your CLS metric score.
2. The main thread was not blocked for any significant time.

   When files block the main thread, users are unable to interact with the page content. Typically, parsing and executing large JavaScript files, as well as running long JavaScript tasks can block the main thread and should be avoided.
3. Meta Viewport tag is configured properly.

   A meta viewport tag will help a mobile-friendly site scale and display properly on small screen devices.
4. Zero Accessibility Issues were Detected

   Axe found no accessibility issues.
5. Final HTML (DOM) size is significantly larger than initially delivered HTML (24.17kb larger, or 93.67% of total HTML).

   Typically this is due to over-reliance on JavaScript for generating content, but increases can also happen as a result of browsers normalizing HTML structure as well. When critical HTML content is generated with JavaScript in the browser, it can increase the time it takes for content to be made accessible to assistive technology such as screen readers.

   Relevant Tips

   • Look for ways to deliver more HTML content from the start

     Many modern frameworks offer patterns for generating useful HTML on the server.

WebPageTest ran 4 diagnostic checks related to this category and found 1 opportunities.

1. Zero render-blocking third-party requests found.

   By default, references to external JavaScript and CSS files will block the page from rendering. Third-party blocking requests are particularly risky, as your page's access relies on their response time and availability.
2. Zero security vulnerabilies were detected by Snyk

   Snyk has found 0 security vulnerabilities with included packages.
3. Zero resources were found that were loaded over an insecure connection.

   Loading requests over HTTPS necessary for ensuring data integrity, protecting users personal information, providing core critical security, and providing access to many new browser features.
4. Final HTML (DOM) size is significantly larger than initially delivered HTML (24.17kb larger, or 93.67% of total HTML).

   Typically this is due to over-reliance on JavaScript for generating content, but increases can also happen as a result of browsers normalizing HTML structure as well. Common issues such as JavaScript errors and third-party network delays and outages can present potential single points of failure.

   Relevant Experiments

   • Disable Scripts

     This experiment makes all scripts (inline and external) unrecognizable as javascript by the browser in order to demonstrate whether the site will still be usable if JavaScript fails to properly run.

     Assets included in experiment:
     Login to WebPageTest to run Pro experiments.

   • Make Scripts Timeout

     This experiment directs specified requests to WebPageTest's blackhole server, which will hang indefinitely until timing out. Use this experiment to test your site's ability to serve content if these services hang.

     Assets included in experiment:

     1. www.googletagmanager.com
     2. www.google-analytics.com
     Login to WebPageTest to run Pro experiments.

   • Block Script Requests

     This experiment causes specified requests to fail immediately. Use this experiment to test your site's ability to serve content if these services are unavailable.

     Assets included in experiment:

     1. /svg4everybody.min.js
     2. /static/js/main.b7ff81bb.js
     3. /gtag/js?id=G-TYZK686PZ2
     4. /gtm.js?id=GTM-PNR87FP
     5. /analytics.js
     6. /gtag/js?id=G-TYZK686PZ2&cx=c&_slc=1
     7. /gtag/js?id=G-SW2TVH2WBY&cx=c&_slc=1
     Login to WebPageTest to run Pro experiments.