Gatsby: A preload <link> was found, but not used.

Created on 23 Aug 2019  路  18Comments  路  Source: gatsbyjs/gatsby

Hello Mates,

Lately our score went from 95 to 40-50 on Pagespeed, and it's because of the warnings shown below;

A preload <link> was found for "https://wk.ntstage.com/static/d/140/path---index-6a9-0SUcWyAf8ecbYDsMhQkEfPzV8.json" but was not used by the browser. Check that you are using the `crossorigin` attribute properly.

A preload <link> was found for "https://wk.ntstage.com/component---src-pages-index-js-fb54d7fd4f09cb9a2b50.js" but was not used by the browser. Check that you are using the `crossorigin` attribute properly.

A preload <link> was found for "https://wk.ntstage.com/app-152e5ea376a8423b9ab1.js" but was not used by the browser. Check that you are using the `crossorigin` attribute properly.

A preload <link> was found for "https://wk.ntstage.com/styles-64bb372d61879437b6bc.js" but was not used by the browser. Check that you are using the `crossorigin` attribute properly.

A preload <link> was found for "https://wk.ntstage.com/1-4ab252d41bd342df663c.js" but was not used by the browser. Check that you are using the `crossorigin` attribute properly.

A preload <link> was found for "https://wk.ntstage.com/3-980b56f7aa10c90ec90a.js" but was not used by the browser. Check that you are using the `crossorigin` attribute properly.

A preload <link> was found for "https://wk.ntstage.com/2-b86faaa88c110034b733.js" but was not used by the browser. Check that you are using the `crossorigin` attribute properly.

A preload <link> was found for "https://wk.ntstage.com/webpack-runtime-df72743627be9e34f51f.js" but was not used by the browser. Check that you are using the `crossorigin` attribute properly.

I"m not sure if it's a plugin conflict, or it has something to do with the gatsby-plugin-preload-link-crossorigin.... Here's my gatsby-config file:

// getting our environment variables
require("dotenv").config({
  path: `.env.${process.env.NODE_ENV}`,
})

module.exports = {
  siteMetadata: {
    title: `Wild Kiwi`,
    description: `We bring your dreams into reality`,
    author: `Pouya Ataei`,
    copyright: `Navigate Group Ltd`,
  },
  plugins: [
    "gatsby-plugin-preload-link-crossorigin",
    `gatsby-plugin-catch-links`,
    `gatsby-plugin-playground`,
    `gatsby-plugin-offline`,
    `gatsby-plugin-sass`,
    {
      resolve: `gatsby-plugin-modal-routing`,
      options: {
        // A selector to set react-modal's app root to, default is `#___gatsby`
        // See http://reactcommunity.org/react-modal/accessibility/#app-element
        appElement: "#___gatsby",

        // Object of props that will be passed to the react-modal container
        // See http://reactcommunity.org/react-modal/#usage
        modalProps: {},
      },
    },
    {
      resolve: `gatsby-source-contentful`,
      options: {
        spaceId: process.env.CONTENTFUL_SPACE_ID,
        accessToken: process.env.CONTENTFUL_ACCESS_TOKEN,
        downloadLocal: true,
      },
    },
    {
      resolve: `gatsby-plugin-nprogress`,
      options: {
        // Setting a color is optional.
        color: `#1abc9c`,
        // Disable the loading spinner.
        showSpinner: true,
      },
    },
    `gatsby-plugin-react-helmet`,
    {
      resolve: `gatsby-source-filesystem`,
      options: {
        name: `images`,
        path: `${__dirname}/src/images`,
      },
    },
    {
      resolve: "gatsby-plugin-web-font-loader",
      options: {
        custom: {
          families: [
            "Nunito-Regular",
            "Nunito-Black",
            "Nunito-SemiBold",
            "Nunito-Extrabold",
            "Nexa-Rust-2",
          ],
          urls: ["fonts.css"],
        },
      },
    },
    `gatsby-transformer-sharp`,
    `gatsby-plugin-sharp`,
    {
      options: {
        plugins: [
          {
            resolve: `gatsby-remark-images`,
            options: {
              // It's important to specify the maxWidth (in pixels) of
              // the content container as this plugin uses this as the
              // base for generating different widths of each image.
              maxWidth: 590,
            },
          },
        ],
      },
      resolve: `gatsby-transformer-remark`,
      resolve: `gatsby-plugin-manifest`,
      options: {
        name: `Wild Kiwi`,
        short_name: `WK`,
        start_url: `/`,
        background_color: `#f7f0eb`,
        theme_color: `#1abc9c`,
        display: `standalone`,
        icon: `src/images/wild_kiwi_favicon.svg`, // This path is relative to the root of the site.
      },
    },
    // this (optional) plugin enables Progressive Web App + Offline functionality
    // To learn more, visit: https://gatsby.dev/offline
    // `gatsby-plugin-offline`,
    {
      resolve: `gatsby-source-wordpress`,
      options: {
        /*
         * The base URL of the Wordpress site without the trailingslash and the protocol. This is required.
         * Example : 'gatsbyjsexamplewordpress.wordpress.com' or 'www.example-site.com'
         */
        baseUrl: `wildkiwi.com`,
        // The protocol. This can be http or https.
        protocol: `https`,
        // Indicates whether the site is hosted on wordpress.com.
        // If false, then the assumption is made that the site is self hosted.
        // If true, then the plugin will source its content on wordpress.com using the JSON REST API V2.
        // If your site is hosted on wordpress.org, then set this to false.
        hostingWPCOM: false,
        // If useACF is true, then the source plugin will try to import the Wordpress ACF Plugin contents.
        // This feature is untested for sites hosted on wordpress.com.
        // Defaults to true.
        useACF: true,
        // Set verboseOutput to true to display a verbose output on `npm run develop` or `npm run build`
        // It can help you debug specific API Endpoints problems.
        verboseOutput: true,
        // Set how many pages are retrieved per API request.
        perPage: 5,
        // Search and Replace Urls across WordPress content.
        searchAndReplaceContentUrls: {
          sourceUrl: "https://wildkiwi.com/",
          replacementUrl: "https://wildkiwi.com/",
        },
        // Set how many simultaneous requests are sent at once.
        concurrentRequests: 4,
        // Set WP REST API routes whitelists
        // and blacklists using glob patterns.
        // Defaults to whitelist the routes shown
        // in the example below.
        // See: https://github.com/isaacs/minimatch
        // Example:  `["/*/*/comments", "/yoast/**"]`
        // ` will either include or exclude routes ending in `comments` and
        // all routes that begin with `yoast` from fetch.
        // Whitelisted routes using glob patterns
        includedRoutes: [
          `**/categories`,
          `**/posts`,
          `**/taxonomies`,
          `**/users`,
          `**/media`,
          `/yoast/**`,
        ],
        // use a custom normalizer which is applied after the built-in ones.
        normalizer: function({ entities }) {
          return entities
        },
      },
    },
    {
      resolve: `gatsby-plugin-netlify-headers`,
      options: {
        headers: {}, // option to add more headers. `Link` headers are transformed by the below criteria
        allPageHeaders: [], // option to add headers for all pages. `Link` headers are transformed by the below criteria
        mergeSecurityHeaders: true, // boolean to turn off the default security headers
        mergeLinkHeaders: false, // boolean to turn off the default gatsby js headers (disabled by default, until gzip is fixed for server push)
        mergeCachingHeaders: true, // boolean to turn off the default caching headers
        transformHeaders: (headers, path) => headers, // optional transform for manipulating headers under each path (e.g.sorting), etc.
      },
    },
  ],
}

The project is live at this URL : https://wk.ntstage.com/
And here is the github repo : https://github.com/Polyhistor/WildKiwi

What are you thoughts guys? please illuminate me.

Cheers.

stale? needs more info bug

Most helpful comment

Same here, any workaround? These Lighthouse complaints are rather annoying.

It has something to do with how the gatsby-plugin-offline preloads these assets.

All 18 comments

What version of gatsby are you running? I would remove gatsby-plugin-preload-link-crossorigin unless you know what you're doing.

Well, I'm using version 2... and I've picked gatsby-plugin-preload-link-crossorigin as a solution to Page Speed warning about cross-origin..... So let's say if I get rid of the plugin, how can I dynamically handle the cross-origin for preload links?

@wardpeet Hey brother, any news on this matter? I could not find anything in the documentation...

Same issue with font and stylesheet preloading

i'll be checking it out today, sorry for the delay.

Any luck or solution?

Hiya!

This issue has gone quiet. Spooky quiet. 馃懟

We get a lot of issues, so we currently close issues after 30 days of inactivity. It鈥檚 been at least 20 days since the last update here.

If we missed this issue or if you want to keep it open, please reply here. You can also add the label "not stale" to keep this issue open!

As a friendly reminder: the best way to see this issue, or any other, fixed is to open a Pull Request. Check out gatsby.dev/contribute for more information about opening PRs, triaging issues, and contributing!

Thanks for being a part of the Gatsby community! 馃挭馃挏

well, issue has not been resolved. we are hoping to see some improvements on version 3. But, thanks for the consideration anyways...

Hey again!

It鈥檚 been 30 days since anything happened on this issue, so our friendly neighborhood robot (that鈥檚 me!) is going to close it.

Please keep in mind that I鈥檓 only a robot, so if I鈥檝e closed this issue in error, I鈥檓 HUMAN_EMOTION_SORRY. Please feel free to reopen this issue or create a new one if you need anything else.

As a friendly reminder: the best way to see this issue, or any other, fixed is to open a Pull Request. Check out gatsby.dev/contribute for more information about opening PRs, triaging issues, and contributing!

Thanks again for being part of the Gatsby community!

Any word on this? I seem to be running into the same issue. @Polyhistor @wardpeet

Same problem here.

Did anyone find a solution?

Bumping again, this appears to be tanking my lighthouse scores.

Same case here, any news?

Same here, any workaround? These Lighthouse complaints are rather annoying.

It has something to do with how the gatsby-plugin-offline preloads these assets.

I'm running into the same issue. I'm just curious if this error is actually impacting lighthouse performance or whether it's harmless because we've noticed a significant drop across the board for one of our Gatsby sites performance-wise.

Also impacted, can we reopen this?

Would like to see reopened as well. Not using "gatsby-plugin-preload-link-crossorigin"

Also seeing this from our lighthouse scores when attempting to use the gatsby-plugin-offline. At least some communication from the gatsby team on if this is something they are going to look into would be appreciated.

Most likely a duplicate of #25360

Was this page helpful?
0 / 5 - 0 ratings

Related issues

signalwerk picture signalwerk  路  3Comments

ghost picture ghost  路  3Comments

theduke picture theduke  路  3Comments

jimfilippou picture jimfilippou  路  3Comments

hobochild picture hobochild  路  3Comments