# add-prefetch-link > Add prefetch links to speed up page navigation Latest version **1.0.6** (published 2022-05-06) · MIT license · 0 weekly downloads ## Install ```sh npm install add-prefetch-link pnpm add add-prefetch-link yarn add add-prefetch-link bun add add-prefetch-link ``` ## Health **Score 25/100 (F)** — status: abandoned. Positive: has types; esm support; no vulnerabilities. Warnings: low downloads. Negative: abandoned; low maintenance score. ## Facts | | | |---|---| | Version | 1.0.6 | | Published | 2022-05-06 | | First published | 2021-09-08 | | Weekly downloads | 0 | | License | MIT | | TypeScript types | bundled | | Module format | ESM + CommonJS | | Dependencies | 0 | | Unpacked size | 5.3 KB | | Known vulnerabilities | 0 | | Install scripts | no | | Author | Tony Spegel | | Maintainers | tonyspegel | | Keywords | prefetch, perf | ## Links - npm: https://www.npmjs.com/package/add-prefetch-link - Repository: https://github.com/TonySpegel/addPrefetchLink - Homepage: https://github.com/TonySpegel/addPrefetchLink#readme - Issues: https://github.com/TonySpegel/addPrefetchLink/issues - npm.io page: https://npm.io/package/add-prefetch-link ## Recent versions - 1.0.6 (latest) — 2022-05-06 - 1.0.5 — 2021-12-07 - 1.0.4 — 2021-10-05 - 1.0.3 — 2021-10-04 - 1.0.2 — 2021-09-19 - 1.0.1 — 2021-09-15 - 1.0.0 — 2021-09-08 ## README # addPrefetchLink Adds links with `rel="prefetch"` on user interaction to speed up page navigation. Loosley inspired by [quicklink](https://getquick.link/). ## How it works **addPrefetchLink** registers a set of EventListeners per link (by default: `mouseover` and `focus`) which will then add a prefetch-link to your ``-element. To avoid unnecessary network requests only one of the events per link will execute that process. Links won't be added on slow connections or under data saver settings. [Codepen Demo](https://codepen.io/TonySpegel/full/PojrqZb) ## Usage ```bash # Installation: npm i add-prefetch-link ``` ```javascript // Import library import { addPrefetchLink } from 'add-prefetch-link'; // Select links const links = document.querySelectorAll('a:not([href^="mailto:"]):not([href^="tel:"])'); // Call addPrefetchLink on every link links.forEach((link) => addPrefetchLink(link)); // Use your own set of events links.forEach((link) => addPrefetchLink(link, ['focus'])); ``` ## Limitations This package is build with the latest module standard to date so it won't work as an AMD or CommonJS module --- _Source: https://npm.io/package/add-prefetch-link · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._