one
Version:
One is a new React Framework that makes Vite serve both native and web.
142 lines (141 loc) • 4.5 kB
JavaScript
import { useEffect, useRef } from "react";
import { getURL } from "../getURL.mjs";
import { preloadRoute } from "../router/router.mjs";
const PREFETCH_MODE = process.env.ONE_LINK_PREFETCH || "intent";
function getHrefFromTarget(url, target) {
if (!(target instanceof HTMLElement)) return null;
const anchor = target instanceof HTMLAnchorElement ? target : target.closest("a");
if (!(anchor instanceof HTMLAnchorElement)) return null;
const href = anchor.getAttribute("href");
if (!href) return null;
if (href[0] === "/" || href.startsWith(url)) {
return href.replace(url, "");
}
return null;
}
function PreloadLinks() {
if (typeof window === "undefined") {
return null;
}
if (!import.meta.env.PROD) {
useEffect(() => {
const url = getURL();
const controller = new AbortController();
document.addEventListener("mouseover", e => {
const href = getHrefFromTarget(url, e.target);
if (href) preloadRoute(href);
}, {
passive: true,
signal: controller.signal
});
return () => controller.abort();
}, []);
return null;
}
if (PREFETCH_MODE === "false") {
return null;
}
const cleanupRef = useRef(null);
useEffect(() => {
const url = getURL();
if (PREFETCH_MODE === "hover") {
const controller = new AbortController();
document.addEventListener("mouseover", e => {
const href = getHrefFromTarget(url, e.target);
if (href) preloadRoute(href);
}, {
passive: true,
signal: controller.signal
});
return () => controller.abort();
}
if (PREFETCH_MODE === "viewport") {
import("../link/prefetchViewport.mjs").then(({
startPrefetchViewport,
observePrefetchViewport
}) => {
startPrefetchViewport(preloadRoute);
const cleanups = [];
const seen = /* @__PURE__ */new WeakSet();
const observeLinks = () => {
const links = document.querySelectorAll('a[href^="/"], a[href^="' + url + '"]');
links.forEach(link => {
if (seen.has(link)) return;
seen.add(link);
const href = link.getAttribute("href");
if (href) {
cleanups.push(observePrefetchViewport(link, href.replace(url, "")));
}
});
};
observeLinks();
let timeout;
const observer = new MutationObserver(() => {
clearTimeout(timeout);
timeout = setTimeout(observeLinks, 100);
});
observer.observe(document.body, {
childList: true,
subtree: true
});
cleanupRef.current = () => {
clearTimeout(timeout);
cleanups.forEach(c => c());
observer.disconnect();
};
});
return () => cleanupRef.current?.();
}
if (PREFETCH_MODE === "intent") {
const controller = new AbortController();
import("../link/prefetchIntent.mjs").then(({
startPrefetchIntent,
observePrefetchIntent
}) => {
startPrefetchIntent(preloadRoute);
const cleanups = [];
const seen = /* @__PURE__ */new WeakSet();
const observeLinks = () => {
const links = document.querySelectorAll('a[href^="/"], a[href^="' + url + '"]');
links.forEach(link => {
if (seen.has(link)) return;
seen.add(link);
const href = link.getAttribute("href");
if (href) {
cleanups.push(observePrefetchIntent(link, href.replace(url, "")));
}
});
};
observeLinks();
let timeout;
const observer = new MutationObserver(() => {
clearTimeout(timeout);
timeout = setTimeout(observeLinks, 100);
});
observer.observe(document.body, {
childList: true,
subtree: true
});
cleanupRef.current = () => {
clearTimeout(timeout);
cleanups.forEach(c => c());
observer.disconnect();
};
document.addEventListener("mouseover", e => {
const href = getHrefFromTarget(url, e.target);
if (href) preloadRoute(href);
}, {
passive: true,
signal: controller.signal
});
});
return () => {
controller.abort();
cleanupRef.current?.();
};
}
}, []);
return null;
}
export { PreloadLinks };
//# sourceMappingURL=PreloadLinks.mjs.map