17 dépôts
Techniques for initiating network requests via browser link tags to populate caches early.
Distinguishing note: Uses browser-native link tags for preloading, distinct from programmatic API-based prefetching.
Explore 17 awesome GitHub repositories matching web development · Resource Preloading. Refine with filters or upvote what's useful.
React est une bibliothèque JavaScript pour créer des interfaces utilisateur basées sur une architecture orientée composants et un flux de données unidirectionnel.
Uses resource hints to download ESM modules early, reducing latency when resources are required.
SWR is a data fetching library that provides a collection of hooks for managing remote data synchronization, caching, and state updates in web applications. It employs a declarative approach to handle complex network request lifecycles and dependency chains, ensuring that client-side application state remains consistent with server data through automatic revalidation and background updates. The library distinguishes itself through a reactive cache layer that automatically synchronizes local state with remote sources based on component lifecycle events. It features event-driven revalidation, w
Initiates network requests using native browser link tags to populate the cache before JavaScript execution begins.
Fasthttp is a high-performance networking framework for Go, designed to maximize throughput and minimize memory overhead in demanding web applications. It functions as a specialized HTTP server and client library that prioritizes efficient resource management, allowing developers to build scalable services capable of handling massive concurrent traffic with minimal garbage collection pressure. The library distinguishes itself through a focus on zero-allocation processing and low-level optimization. It achieves this by recycling temporary request and response objects through managed pools and
Transmits informational responses to trigger resource preloading while the server prepares final content.
Motion Canvas is a TypeScript-based framework for creating programmatic animations and motion graphics. It functions as a code-based animation tool that allows developers to define visual transitions, element properties, and timing through scripts rather than traditional timeline-based interfaces. The library renders frame-accurate motion graphics directly in the browser using web technologies. The project utilizes a virtual scene graph to manage visual objects and their transformations, which are then rendered to an HTML5 canvas. It employs generator functions to sequence animations and reac
Processes and caches external media resources during the build phase to ensure seamless playback without latency.
react-loadable is a React component lazy loader and JavaScript bundle orchestrator designed to manage the delivery of asynchronous components. It provides a bridge for server-side rendering to coordinate dynamic module preloading and prevent content flicker during client hydration. The project includes a dynamic component preloader to trigger background fetches of visual components before they are required on screen. It utilizes a system to map individual modules to their respective bundles, ensuring the correct assets are delivered. The library covers code splitting workflows and asynchrono
Initiates network requests for JavaScript bundles before the components are required for rendering.
Workbox is a modular library and toolkit designed for managing service workers in progressive web applications. It provides a comprehensive framework for handling asset caching, request routing, and background script lifecycle management, enabling developers to build web applications that function reliably offline and load efficiently. The project distinguishes itself through a declarative routing engine and a plugin-based architecture that allows for the injection of custom logic into the request and response processing pipeline. It supports advanced caching patterns, such as cache-first or
Activates browser-level navigation preloading to reduce latency for network-first requests by fetching resources in parallel.
React is a JavaScript library for building user interfaces through the composition of modular, self-contained components. It employs a declarative programming model where developers describe the desired visual state, and the library automatically manages the underlying document updates and state synchronization. By utilizing a virtual representation of the document, it calculates and applies minimal changes to the browser, ensuring efficient rendering even in complex applications. The library distinguishes itself through a sophisticated scheduling system that manages rendering work in increme
Initiates early network requests for scripts, stylesheets, and fonts to improve page performance.
This repository contains the HTML specification, which defines the core standards for web page structuring, content organization, and document rendering. It establishes the fundamental algorithms for state-machine-based tokenization, tree construction for the document object model, and origin-based security isolation. The specification provides a framework for defining custom elements with independent lifecycles and registries. It also details the requirements for cross-document communication, session history management, and the synchronization of interface properties with content attributes.
Defines the standards for fetching high-priority assets immediately to optimize page loading performance.
Snapdom is a DOM capture engine that serializes live web page elements into images, videos, documents, and other formats. It converts any DOM subtree into PNG, JPG, WebP, SVG, PDF, or self-contained HTML, and can record animating elements as video files or animated GIFs using the browser's MediaRecorder API. The library distinguishes itself through a plugin-based architecture that allows custom output format handlers and pipeline hooks to extend the capture process without re-cloning the source element. It manages separate caches for images, styles, and fonts with preloading and clearing meth
Fetches images, backgrounds, and fonts before a capture to prevent rendering stalls.
Waku is a minimal React framework built around React Server Components. It renders components exclusively on the server for data fetching and server-side logic, then hydrates client components in the browser for interactivity. The framework supports hybrid rendering, mixing static prerendering at build time with dynamic per-request rendering within a single application, and allows independently loading slice components that can be static or dynamic. The framework distinguishes itself through its file-based routing system that defines pages, layouts, and API endpoints by placing files in a dir
Prefetches internal link destinations ahead of navigation to improve page transition speed.
instant.page is a client-side JavaScript library that preloads linked pages on hover or touch interactions, making navigation feel instantaneous without consuming unnecessary bandwidth. It works by starting to fetch a page the moment a user hovers over a link for 65 milliseconds, leaving over 300 milliseconds for the page to load before the click, and similarly preloads on touch start for mobile visitors. The script offers multiple preloading strategies to balance responsiveness with resource conservation. It can be configured to preload on mousedown, when links become visible in the viewport
Preloads linked pages on hover or touch to make navigation feel instant without consuming unnecessary bandwidth.
Tape is a TAP-producing test framework for Node.js that provides assertions, spies, subtests, and isolated test harnesses. It functions as both a test runner and an assertion library, outputting results in the Test Anything Protocol format for machine or human consumption. The framework manages test execution through callback-based async control, plan-based auto termination, and subtest stack isolation. It includes a spy wrapper system that replaces object methods with call-recording wrappers that restore originals during teardown, along with a teardown callback registry that collects and exe
Supports preloading modules via command-line flag for transpiler setup before tests run.
Instantclick est un améliorateur de navigation côté client et un préchargeur de page JavaScript. Il intercepte les requêtes HTTP pour mettre à jour les titres de page et le contenu via des requêtes asynchrones, évitant les rafraîchissements complets du navigateur pour éliminer les flashs blancs pendant la navigation. Le projet réduit la latence perçue du frontend en récupérant le contenu lié en arrière-plan lorsqu'un utilisateur survole un lien hypertexte. Ce préchargement basé sur l'intention garantit que le contenu est prêt au moment où un utilisateur clique. L'outil gère l'expérience de navigation via la manipulation de l'historique côté client et l'injection de contenu basée sur le DOM. Il inclut également un indicateur de progression de navigation personnalisable qui fournit un retour visuel pendant que les requêtes de page asynchrones sont traitées.
Preloads linked pages on hover to make navigation feel instant without consuming unnecessary bandwidth.
Un thème Material Design responsive pour les blogs statiques construits avec le framework Hexo. Il fonctionne comme un système de mise en page complet qui transforme les fichiers markdown en pages HTML stylisées, offrant un environnement spécialisé pour la documentation technique et le blogging personnel. Le thème se caractérise par une approche axée sur les données pour la visualisation du contenu, utilisant des graphiques radar pour les catégories et des nuages de mots pour les tags afin de représenter les métadonnées des articles. Il se distingue par une architecture chronologique pour les archives du blog. Le projet couvre un large éventail de capacités de publication technique, incluant le rendu de formules mathématiques, la coloration syntaxique pour les blocs de code et la génération de tables des matières adaptatives. Il inclut des outils de personnalisation via des pages d'accueil dynamiques, des menus de navigation multi-niveaux et des pages de profil détaillées. L'engagement des lecteurs est soutenu par une recherche intégrée, des articles protégés par mot de passe et l'intégration de systèmes de commentaires et de chat tiers. La performance est gérée via le routage des ressources CDN et le préchargement des assets, tandis que la visibilité SEO est gérée via des métadonnées configurables.
Optimizes page delivery by preloading essential assets and routing resources through CDNs.
smoothState.js est un gestionnaire de navigation AJAX et une bibliothèque de transition de page jQuery conçue pour créer des transitions fluides entre les pages en chargeant le contenu distant de manière asynchrone. Il fonctionne comme un gestionnaire d'état d'historique de navigateur qui attache des données sérialisables personnalisées aux entrées d'historique et gère les redirections d'URL sans nécessiter de rafraîchissements complets du navigateur. La bibliothèque inclut un cache de page côté client qui stocke les pages précédemment visitées en mémoire pour un rechargement instantané. Elle réduit davantage les temps de chargement perçus grâce à un système de préchargement de contenu qui initie des requêtes réseau lorsqu'un utilisateur survole un lien. Le projet fournit des outils pour gérer les cycles de vie de chargement et orchestrer les animations lors de l'entrée et de la sortie des éléments de page. Il permet également l'interception et la modification des requêtes de navigation et des paramètres avant que le contenu ne soit récupéré et injecté dans le document.
Provides programmatic link prefetching on hover to reduce perceived latency during page navigation.
Ce projet est une implémentation de React Server Components, fournissant une architecture de composants full-stack qui mélange le rendu côté serveur avec l'interactivité côté client. Il permet le développement d'applications web où les composants côté serveur uniquement pour la récupération de données et les composants clients interactifs coexistent au sein d'un seul arbre de composants. Le système se concentre sur l'orchestration des données serveur-client, permettant l'exécution de fonctions serveur et de mutations de base de données à travers la limite réseau. Il se distingue par une architecture de composants hybride qui déplace l'exécution des composants vers le serveur pour réduire la taille des bundles clients et améliorer les temps de chargement initiaux. Le projet couvre une large gamme de capacités, y compris la récupération de données asynchrone avec suspense, la mémoïsation automatique des composants et l'optimisation du rendu côté serveur. Il inclut également des outils pour gérer l'état complexe, coordonner le chargement des actifs pour éviter les décalages de mise en page, et construire des applications multiplateformes pour le web et le mobile. L'outillage de développement est fourni pour détecter les composants impurs, analyser les dépendances des modules et inspecter les hiérarchies de composants pendant le développement.
Utilizes browser link tags to initiate early network requests for scripts and fonts to reduce latency.
Ce projet est une référence technique et un guide pour optimiser les performances des applications Angular. Il fournit une liste de contrôle complète pour améliorer la vitesse et l'efficacité en se concentrant sur l'optimisation des bundles, les meilleures pratiques de rendu et l'exécution au moment de l'exécution (runtime). Le guide couvre un large éventail de différenciateurs, notamment la mise en œuvre de stratégies d'applications web progressives (PWA) via des service workers et la mise en cache hors ligne. Il détaille également des méthodes pour améliorer les temps de chargement perçus en utilisant le rendu côté serveur et les shells d'application. Le dépôt fournit des conseils sur des domaines de compétences plus larges tels que le réglage de la détection de changement, l'utilisation de web workers pour décharger les calculs lourds, et la gestion du DOM via le défilement virtuel. Il couvre également la réduction de la taille des bundles via le tree-shaking, la minification et le fractionnement des modules en chargement paresseux (lazy-loading).
Loads assets, styles, or modules in the background before they are requested to improve experience.