Per SiteImprove’s Performance: Establish a pre-connection to the server
About this issue:
Use <link rel="preconnect"> to tell the browser to initiate a connection to the server so that any DNS lookups, redirects, and other pre-connection activities are done in advance. This means users spend less time waiting for the page to load.
====
I was wondering if Percussion will implement this in the next update? If not, I can add it myself. I wanted to make sure. Thanks.
Hi Aaron,
We currently have a feature checked in that uses loadCSS to preload and asynchronously load CSS. We haven’t added preconnect.
# loadCSS
[](https://www.npmjs.org/package/fg-loadcss) [](https://david-dm.org/filamentgroup/loadCSS) [](https://david-dm.org/filamentgroup/loadCSS?type=dev)
A function for loading CSS asynchronously
[c]2017 @scottjehl, @zachleat [Filament Group, Inc.](https://www.filamentgroup.com/)
Licensed MIT
## Why loadCSS?
Referencing CSS stylesheets with `link[rel=stylesheet]` or `@import` causes browsers to delay page rendering while a stylesheet loads. When loading stylesheets that are not critical to the initial rendering of a page, this blocking behavior is undesirable. The new `<link rel="preload">` standard enables us to load stylesheets asynchronously, without blocking rendering, and loadCSS provides a JavaScript polyfill for that feature to allow it to work across browsers. Additionally, loadCSS offers a separate (and optional) JavaScript function for loading stylesheets dynamically.
* Latest release: https://github.com/filamentgroup/loadCSS/releases
* NPM: https://www.npmjs.com/package/fg-loadcss
## Install via npm
`npm install fg-loadcss --save`
## How To Use loadCSS (Recommended example)
show original
This still needs to clear QA and customer testing.
If you take a look at the browser compatibility for the preconnect attribute (and preload), it is not 100%:
You can definitely add this to your own templates now and those browsers that can take advantage can use it.
-n
