Közzétéve: 2026. június 23. (vendégszerző: Thomas Steiner, Chrome csapat, Google)
A Transformers.js könyvtár webfejlesztőknek egyszerű hozzáférést ad a transformer-alapú modellekhez böngészőben futó task-specifikus pipeline-okon keresztül. Egy pipeline például automatikus beszédfelismerésre (ASR) így indítható:
import { pipeline } from 'https://cdn.jsdelivr.net/npm/@huggingface/transformers@4.2.0';
const asr = await pipeline('automatic-speech-recognition', 'Xenova/whisper-tiny.en', { device: 'webgpu' });
const result = await asr('jfk.wav');
console.log(result);
A probléma: gyorsítótárak szigetelése és duplikált erőforrások
Amikor a fenti példát a böngészőben futtatjuk, Transformers.js letölti és a Cache API-ba tárolja a modell- és Wasm-erőforrásokat, így oldal újratöltésekor a modellek gyakorlatilag azonnal rendelkezésre állnak. Ugyanakkor a népszerű modellek — például a Transformers.js alapértelmezett ASR modellje, a Xenova/whisper-tiny.en — többször is lekérésre kerülhetnek különböző webhelyekről. Egy egyszerű szimulációban ez 177 MB ismétlődő letöltést és tárolást jelentett a Chrome DevTools Application panelben.
A helyzetet tovább rontja a közös futtatókörnyezet (Wasm): a Transformers.js által használt ONNX Runtime például egy 4,733 kB méretű ort-wasm-simd-threaded.asyncify.wasm fájlra támaszkodik, amelyet több, teljesen különböző modellel működő pipeline is igényel. Ha másik originről töltjük az alkalmazást, a böngésző a Wasm fájlt is újra letölti és külön tárolja.
Az oka: a böngészők (Chrome példáján) cache-szigetelést alkalmaznak biztonsági és adatvédelmi okokból. A Cache API erőforrások kulcsa nem csak az URL, hanem egy Network Isolation Key is, amely a top-level site és a current-frame site kombinációjából áll. Ennek következtében azonos URL-ekre irányuló kérések is külön gyorsítótár-bejegyzést hoznak létre, ha más originben történik a betöltés — ezért van a duplikált letöltés és tárolás.
A Cross-Origin Storage (COS) javasolt API
A javasolt Cross-Origin Storage (COS) API egy navigator.crossOriginStorage interfészt vezetne be, amely lehetővé tenné nagy fájlok tárolását és lekérését origin-határokon át hash-alapú azonosítással (cryptographic hash). A megközelítés lényege, hogy a fájlokat URL helyett kriptográfiai hashel azonosítja a rendszer, így byte-by-byte azonos fájlokat felismerhet egységesen, bármely eredeti forrástól függetlenül.
A működés vázlata — alapvető példa:
const hash = { algorithm: 'SHA-256', value: '8f434346648f6b96df89dda901c5176b10a6d83961dd3c1ac88b59b2dc327aa4' };
try {
const handle = await navigator.crossOriginStorage.requestFileHandle(hash);
const fileBlob = await handle.getFile(); // Cache hit
} catch {
const fileBlob = await fetch('https://cdn.jsdelivr.net/.../ort-wasm-simd-threaded.asyncify.wasm').then(r => r.blob());
const handle = await navigator.crossOriginStorage.requestFileHandle(hash, { create: true, origins: '*' });
const writableStream = await handle.createWritable();
await writableStream.write(fileBlob);
await writableStream.close();
}
Ha a fájl ott van COS-ban, a requestFileHandle egy FileSystemFileHandle-t ad vissza, amiből getFile()-lal közvetlenül olvasható a Blob. Ha nincs ott, a kód a hálózatról tölti le, majd eltárolja COS-ban a jövőbeni felhasználásra.
Láthatóság és hozzáférés-szabályozás
A COS lehetővé teszi a finom kontrolt az origins opcióval:
- origins: '*' — a fájl globálisan elérhető lesz, minden origin megtalálhatja a hash alapján. Ez megfelelő AI modellekre és közös Wasm runtime-okra, ahol előnyös, hogy minden alkalmazás ugyanazt a cache-elt példányt használja.
- origins: [lista] — csak a megadott origin-ek férhetnek hozzá; ez hasznos vállalati, zárt erőforrásoknál.
- origins elhagyása — a fájl only same-site elérhetőséget kap, ami jó alapértelmezés céges aldomain-megosztáshoz.
Fontos szabály: a fájl láthatósága soha nem csökkenthető. Ha egy fájl már globálisra van állítva, egy későbbi korlátozó tárolási kísérlet figyelmen kívül kerül. Ellenben egy korábban korlátozott fájl később tehető szélesebb körűvé: bármely oldal kérheti create: true-val és szélesebb origins értékkel, és ha a böngésző ellenőrzi, hogy a hash egyezik, a fájl elérhetővé válik a nagyobb közönség számára. Az upgrade útvonalnál a böngésző megköveteli, hogy a kérő oldal ténylegesen írja is a fájlt keresztül a handle-on, hogy ne lehessen oldalsávon keresztül adatot szivárogtatni.
Integritás garantálása
A COS íráskor automatikusan ellenőrzi a megadott hash-t: ha a feltöltött adatok nem egyeznek a deklarált hash-sel, a művelet hibára fut. Ez beépített integritásellenőrzést ad: az olvasó biztos lehet benne, hogy pontosan a várt bájtokat kapja — akár a hivatalos Hugging Face CDN-ről, akár egy önálló tükörről érkezett a fájl.
Adatvédelmi megfontolások
A kereszt-origin megosztott gyorsítótár potenciálisan lehetővé tenné, hogy egy rosszindulatú oldal fájlok jelenlétét kémlelve információt szerezzen a felhasználó böngészési előzményeiről. A COS ezt kétféle módon igyekszik csökkenteni:
- Fejlesztői kontroll: proprietáris erőforrást nem szabad origins: '*'-szal tárolni.
- Availability gating: a böngésző visszautasíthatja egy ritka fájl jelenlétének megerősítését, ha az nem fordult elő elegendő különböző originen — ilyenkor hibaüzenetet ad, mintha a fájl nem lenne tárolva. Ennek célja a ritka erőforrások keresztoldali azonosítóként való felhasználásának megakadályozása.
Ajánlott viselkedés: hiba esetén mindig a hálózati visszaesés kezelése legyen az alkalmazás viselkedése.
Mit jelent ez a Transformers.js példára nézve?
A bemutatott toy-példában az ort-wasm-simd-threaded.asyncify.wasm 4,733 kB, és minden Transformers.js-alkalmazás használja. COS-szal az első alkalmazás letölti és SHA-256 hash-sel, origins: '*'-szal tárolja; minden későbbi app, bármely originről, azonnal megtalálja azt COS-ban. Ugyanez igaz a Xenova/whisper-tiny.en modellre: a 177 MB ismétlődő súly ismét csak egyszeri átvitelre korlátozódik, mert a második alkalommal a hash alapján a modell azonnal elérhető lesz COS-ból.
Transformers.js kísérleti támogatása
A Transformers.js már pilotként integrálja a COS-t a könyvtár szintjén: a Pull request #1549 egy kísérleti COS cache backend-et vezetett be egy opt-in flag mögé. Használata egyszerű:
import { env, pipeline } from "https://cdn.jsdelivr.net/npm/@huggingface/transformers@4.2.0";
// 👇 Opt in to the experimental Cross-Origin Storage cache backend.
env.experimental_useCrossOriginStorage = true;
const asr = await pipeline('automatic-speech-recognition', 'Xenova/whisper-tiny.en', { device: 'webgpu' });
A flag neve deliberate: az experimental_ prefix azt jelzi, hogy a böngészőoldali API még nem szabványosított és változhat. A Transformers.js feloldja a modellek Xet-pointerjeit, kinyeri az oid sha256: mezőt, és az így kapott hash-t használja a navigator.crossOriginStorage-hoz. Ha a modell már COS-ban van, azonnal szolgáltatható; ha nincs, a rendszer letölti és elmenti.
Modellflexibilitás
A Model Registry funkció lehetővé teszi rugalmas modellválasztást: ha az alkalmazás bármelyik Whisper-variánst használhatja (pl. Xenova/whisper-tiny.en, whisper-medium.en vagy Xenova/whisper-large-v3), a registry-ben lévő fájlok ellenőrzésével meg lehet nézni, mely fájlok vannak már részben vagy teljesen a COS-ban. A ModelRegistry.is_pipeline_cached() API közvetlenül integrál a COS-szal és a Cache API-val.
Hogyan próbálhatja ki ma?
Mivel a COS még nincs natívan beépítve egyik böngészőbe sem, a szerző kísérleti Cross-Origin Storage extensiont javasol, amely injektálja a navigator.crossOriginStorage polyfillt az oldalakra. Az extension forrása és használati útmutatója elérhető; az extension telepítése után a teljes end-to-end élményt kipróbálhatjuk a példaalkalmazásokkal, és ellenőrizhetjük, hogy a korábbi 177 MB újratöltés helyett a modell COS-ból töltődik be milliszekundumok alatt. Az extension popupjában megjeleníthető a megosztott fájl SHA-256 hash-e (például 950978b1dbcbf250335358c1236053ba19a7f7849b33dc777f4421b72b7626fa) és azok az origin-ek, amelyeknek COS-ában szerepel.
Felhasználói teendők és további szereplők
Ha Transformers.js alkalmazást fejleszt, a szerző javaslata egyszerű: állítsa be env.experimental_useCrossOriginStorage = true a pipeline() hívás előtt, telepítse az extensiont, és figyelje a hálózati lapot — a duplikált letöltések eltűnnek. Az opt-in kockázatmentes: ha a böngésző vagy felhasználó nem támogatja a COS-t, a kód a Cache API-ra esik vissza.
Más projektek is kísérleteznek a COS-szal: WebLLM (opt-in) és wllama (automatikus PR alapján) szintén érdeklődnek a javasolt API iránt.
A Chrome csapat mérlegeli a COS natív implementációját a böngészőben. Mivel a COS kezdeti állapotú javaslat, a fejlesztők visszajelzéseit várják a Cross-Origin Storage repositoryban, ahol issue-kat lehet nyitni, támogatást kifejezni, vagy PR-eket beküldeni.
