Excluded Resources

Evgeni Yordanov

February 05, 2021 16:09

With the “Excluded Resources” feature, you can tell NitroPack not to optimize:

CSS and JavaScript resources
Fonts
Images

“Excluded Resources” works in a way that our service will optimize everything else, except for the resources that are excluded. Instead, they will be loaded directly from their original sources.

To do so, you need to enable the feature from the General Settings panel and fill out a bit of information.

Asset URL/Code

For external resources, you must enter the resource URL.

It is usually a full URL pointing to a resource that is linked on the page. For example, https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js

For inline resources (code that is inside the HTML), write down a single line of code that’s unique to the resource. NitroPack will recognize the line and exclude the entire resource.

Also, don’t include the <script> or <style> tag.

For example, to exclude this inline script:

Skip the <script> tags.

And choose one line of code that’s unique to the resource.

You can use the wildcard symbol * to match more than one resource with a single rule or to avoid writing the entire snippet.

In our example, we can exclude the script by entering document*cta-btn instead of the entire line of code.

You can also use wildcards to exclude all resources containing the same word in their name.

For example, if you don’t want PNG images to be optimized by NitroPack, you can add the following exclude rule:

If you have resources with dynamic parts in them (like dynamic URLs), you can also use the wildcard to match their dynamic parts.

In the example above, adding * in front of ".png" includes all paths that end in ".png" while adding it after it includes all paths that have text after ".png". The combination of the two covers any path that includes ".png".

The above will exclude [anything].png[anything]. If images have URLs like:

domain.com/cart.png
domain.com/dog.png

The above rule will exclude both of the images because the .png part is common and everything else is captured by the wildcard (*).

Resource Type

Next, you can choose between the resource types we mentioned above.

Resource Relation

You can also specify if the resource is external or inline.

An external resource is anything specified by the <src> or href (for external CSS) attributes. Conversely, an inline resource is located in the HTML markup. The first example in this article shows how to exclude an inline script.

Device

By default, the resource will be excluded from optimization on all devices. You can also exclude it only for certain devices.

For instance, if you select “Mobile”, the specified resource will be optimized only on Desktop and Tablet devices.

Excluded Operations

If you don’t select an excluded operation, NitroPack will ignore the resource. It’ll be excluded from all forms of optimization, including our resource-loading strategy.

You can change that by choosing one or more operations that you don’t want to be performed.

For more information on each of these, check out our article on Excluded Operations.

📌Remember to save your settings after filling out all the fields.