xuhdev
xuhdev

Reputation: 9360

Use both preconnect and preload, for different resources from the same domain

I have an HTML page that I intended to load two cross-domain resources: https://example.com/main.js and https://example.com/something-unknown.css, where the exact URL of something-unknown.css is unknown until a later stage in parsing the HTML file.

If the page only needs to load main.js (in the later stage of parsing HTML file), the following should optimize loading the file:

<link rel="preload" href="https://example.com/main.js" as="script" />

If the page only needs to load something-unknown.css, the following should optimize the loading time:

<link rel="preconnect" href="https://example.com" />

However, if the page needs both, is the preload link tag alone sufficient?

I'm a bit concerned that if only the preload link tag is present, the browser may close the connection once it finishes downloading main.js. In this case, the browser may need to reconnect to example.com.

Upvotes: 0

Views: 94

Answers (0)

Related Questions