Quicklink
Integrates the Google Chrome Labs Quicklink library to prefetch visible links during idle time, improving perceived page load performance.
quicklink
Install
composer require 'drupal/quicklink:^2.0'
Overview
The Quicklink module integrates the Quicklink JavaScript library developed by Google Chrome Labs into Drupal. Quicklink uses the Intersection Observer API to detect links that are within the user's viewport and prefetches them during browser idle time. This prefetching technique significantly improves perceived page load performance by having the next page's resources ready before the user clicks.
The module provides a comprehensive administrative interface to configure which links should be prefetched, when the library should load, and various throttling options to control resource usage. It intelligently handles edge cases such as admin paths, AJAX links, hash links, and file downloads to prevent unnecessary prefetching.
By default, the module is configured for optimal performance with anonymous users, automatically ignoring admin paths, AJAX links, hash fragments, and file extensions. The module can load the Quicklink library from a CDN or from a locally hosted copy for better performance.
Features
- Automatic prefetching of visible links using the Intersection Observer API
- Configurable ignore patterns for URLs, selectors, admin paths, AJAX links, hash fragments, and file extensions
- Per-content-type control over library loading
- Session-aware prefetching that can be disabled during active PHP sessions
- Throttle controls including request limits, concurrency limits, viewport delay, and idle timeout settings
- Support for specific path-only prefetching to override all other settings
- Cross-domain prefetching support with configurable allowed domains
- Intersection Observer polyfill support for older browsers (IE11)
- Debug mode with visual indicators and console logging for development
- Automatic CDN fallback when local library is not available
Use Cases
High-traffic content sites
Enable Quicklink for anonymous users only on a news or blog site to significantly improve perceived page load times as readers browse between articles. The library prefetches article links visible in the viewport, making subsequent page navigations feel instant.
E-commerce product catalogs
Configure Quicklink with session awareness disabled for shopping sites. When combined with the 'Do not prefetch during sessions' option, the module avoids prefetching when users have items in their cart, preventing unnecessary server load.
Landing pages with limited navigation
Use the 'Prefetch these paths only' feature to specify exactly which pages should be prefetched from a landing page, ensuring only conversion-critical pages are preloaded while ignoring other site navigation.
Multi-domain Drupal installations
Configure the 'Override allowed domains' setting to enable cross-domain prefetching across multiple domains served by the same Drupal installation, improving navigation between related sites.
Bandwidth-conscious mobile optimization
Use throttle options to limit concurrent requests and total prefetch count, reducing data usage for mobile visitors while still providing performance benefits.
Development and debugging
Enable debug mode to visually identify which links are being ignored and why. Ignored links are marked with a 🚫 emoji and hovering shows the matching rule. Console logging provides detailed configuration and ignore information.
Tips
- Always ignore admin paths and AJAX links in production to prevent unnecessary prefetching and potential side effects
- Use the debug mode during development to understand which links are being prefetched and why others are ignored
- For the best performance, host the Quicklink library locally rather than using the CDN
- Consider using the request limit and concurrency throttle options on pages with many links to prevent overwhelming the server
- The 'noprefetch' URL parameter or '#noprefetch' hash can be added to any URL to temporarily disable Quicklink for debugging
- Links with the 'noprefetch' or 'download' HTML attributes are automatically ignored
- Combine with browser caching and CDN strategies for maximum performance benefits
Technical Details
Admin Pages 1
/admin/config/development/performance/quicklink
Configure how the Quicklink library prefetches links on your site. This page provides comprehensive options to control which links are prefetched, when the library loads, and various performance throttling settings.
Hooks 2
hook_library_info_build
Dynamically builds the quicklink library definition, checking for local file existence and falling back to CDN if not found.
hook_preprocess_html
Attaches the Quicklink libraries and configuration to the page based on current settings, user authentication status, session state, and content type.
Troubleshooting 7
Check that either the local library exists at /libraries/quicklink/dist/quicklink.umd.js or that the CDN (unpkg.com) is accessible. The status report page will show warnings about library location.
Download the correct version (2.3.0) of the Quicklink library from https://unpkg.com/quicklink@2.3.0/dist/quicklink.umd.js and place it in /libraries/quicklink/dist/quicklink.umd.js
Check the 'Prefetch for anonymous users only' setting. By default, the library only loads for anonymous users.
Enable debug mode to see which rules are matching. Add specific URL patterns or CSS selectors to the ignore lists.
Check the 'Do not load library on these content types' checkboxes to ensure the content type is not excluded.
Ensure you are running version 2.x of the Quicklink library. Version 1.x has a different API and is not compatible.
Enable the 'Do not prefetch during sessions' option to disable prefetching when a PHP session is active.
Security Notes 4
- The logout link (/user/logout) is always ignored to prevent accidental session termination
- Admin paths are ignored by default to prevent prefetching of administrative actions
- Cross-domain prefetching is disabled by default and must be explicitly configured
- Session-aware prefetching helps protect against prefetching sensitive user-specific content