# External resources

> External resources are the separate script and stylesheet files a page loads. Each one is another download that can delay rendering.

- **Check ID:** P3
- **Area:** [Performance](https://be1st.ai/glossary/performance)
- **Tool:** [SEO + Security + Performance](https://be1st.ai/tools/ssp-audit)
- **Page:** https://be1st.ai/glossary/performance/external-resources

## Why it matters

Each external resource adds network latency. CSS and JavaScript are render-blocking: the browser cannot display content until all of them are loaded. Too many external resources dramatically slow down First Contentful Paint and increase the time the user sees a blank page.

## In practice

A typical WordPress site loads 15-30 external resources due to plugins. The Google homepage uses only 3-4 external resources. If your site loads 25 external scripts from various CDNs, each adds 50-200 ms of latency and the total delay can reach 2 seconds.

## How be1st checks it

Counts the number of external scripts and CSS files loaded on the page. The ideal count is fewer than 15 (15-30 is a warning). Images are not counted, they have their own check P6. Each external resource requires a DNS lookup, TCP connection, and HTTP request, which adds latency. Render-blocking scripts and styles are particularly problematic.

[SEO + Security + Performance](https://be1st.ai/tools/ssp-audit), Performance tab.

Every check ends as: Pass, Warning, Fail.

## Sources

- [Keep request counts low and transfer sizes small](https://developer.chrome.com/docs/lighthouse/performance/resource-summary) (Chrome for Developers)
- [Optimize resource loading](https://web.dev/learn/performance/optimize-resource-loading) (web.dev)
- [Web Performance](https://developer.mozilla.org/en-US/docs/Web/Performance) (MDN Web Docs)

## Related terms

- [Inline CSS](https://be1st.ai/glossary/performance/inline-css): Inline CSS is styling written directly in the HTML, in `<style>` blocks or style attributes, instead of in a separate stylesheet file.
- [Inline JS](https://be1st.ai/glossary/performance/inline-js): Inline JavaScript is code written directly in the HTML inside `<script>` tags, instead of in a separate file the browser can cache.
- [Image optimization](https://be1st.ai/glossary/performance/image-optimization): Image optimization means serving images in the right size and format and loading the ones below the fold only when they are needed.
- [Total page weight](https://be1st.ai/glossary/performance/total-page-weight): Total page weight is the combined size of everything a page downloads: HTML, CSS, JavaScript, images and fonts.
- [Request count](https://be1st.ai/glossary/performance/request-count): Request count is the number of HTTP requests a browser makes to load a page. Every file, from a script to an icon, is one request.
- [CSS coverage](https://be1st.ai/glossary/performance/css-coverage): CSS coverage is the share of a page's downloaded CSS that the page actually uses. The rest is unused code the browser still has to process.
