Resource

Check the budget for the quantity and size of page resources.

Speed performance

Keeping request counts low

Thanks to SeoChecker you can check the budget for the quantity and size of page resources.

If you want to manage it though, you need to install and set Lighthouse.

Here's the procedure:

  1. Install Lighthouse:
npm install -g lighthouse
  1. Create a file and name it budget.json, with this JSON:
[

  {

    "path": "/*",

    "timings": [

      {

        "metric": "interactive",

        "budget": 3000

      },

      {

        "metric": "first-meaningful-paint",

        "budget": 1000

      }

    ],

    "resourceSizes": [

      {

        "resourceType": "script",

        "budget": 125

      },

      {

        "resourceType": "total",

        "budget": 300

      }

    ],

    "resourceCounts": [

      {

        "resourceType": "third-party",

        "budget": 10

      }

    ]

  }

]

In this file you can notice five separate budgets, divided for TTI, FMP, JavaScript, the overall size of the page and for the requests made to third-party origins.

  1. Use the --budget-path flag to run Lighthouse:
lighthouse https://example.com --budget-path=./budget.json
  1. Check the results:

resource

Share this Guide

Did you like it? Share it!

Share it!

Web tools for modern developers. Try these one!

Over 50 generators, builders and validators to improve your SEO and web performances

Home Back to top of the page