Годинама је неко рекао: "Хеј, можемо ли направити ову апликацију инсталирајућу и радити и оффлине?" Узмите споро, болно спуштање у PWA зечеву рупу: флаки сервисни радници подешавања, кеш хаос, Апп Рутер разбијање ствари, а корисници су заглављени са старим верзијама, осим ако су ручно позвали кеш боговима. Дакле, урадио сам оно што би сваки разумни деве са превише кафе и недовољно стрпљења: изградио сам свој проклети пакет. Introducing: next-pwa-pack То је облога за убацивање за Next.js (иеп, добро ради са Апп Рутером) која вам даје пуну подршку ПВА тако што ћете само обмотати свој распоред са једним провајдером. import { PWAProvider } from "next-pwa-pack"; export default function layout({ children }) { return <PWAProvider>{children}</PWAProvider>; } и Додајте вашу апликацију инсталира као рођену, ради оффлине, кешира странице, синхронизује картице, па чак и бродове са уграђеним деве панелом тако да не морате да погодите да ли нешто функционише. boom Само га пустите и наставите са својим животом. Zašto sam izgradio ovo Сваки пут када је клијент тражио "оффлине-прво" или "ПВА карактеристике", умро сам мало унутра. , само да пронађем да не подржава најновији Апп Роутер, или бих покушао да роолирам свој и на крају освежим страницу да видим да ли је сервисни радник заправо ажурирао. next-pwa На крају, схватио сам да је оно што сам желео било безбрижно подешавање. Нешто што ми је само дало радног сервисног радника, пре-цацхинг, логику ажурирања и контролу верзија - и изашло из пута. Зато сам то изградио. Šta se zaista dešava И под хаубом, Бродови са дефектом , , и Да св.јс се бави ХТМЛ-ом и статичким кеширањем средстава са здравим подразумеваним - ХТМЛ одговори добијају 10-минутни ТТЛ, а средства као што су ЈС, ЦСС и слике се трајно чувају. next-pwa-pack sw.js manifest.json offline.html Да би све картице претраживача биле синхронизоване, користи се догађаји за емитовање ажурирања током сесије. Ако одете ван мреже, служи лаганом tako da se korisnici ne suočavaju sa strašnim belim ekranom. localStorage offline.html И пошто се не ради само о "оффлине", додао сам и малу АПИ тако да можете да комуницирате са кашичним слојем.Желите да очистите све кеширане податке након изласка? Желите да префетцх неке странице након објављивања новог садржаја? Da li je to trik?Takođe postoji ако желите да пратите стање инсталације или слушате нове верзије. clearAllCache() updateSWCache(["/blog", "/dashboard"]) usePWAStatus() Дев Моде Goodies Ako dozvolite У провајдеру, добијате плутајући панел за дебитовање ПВА право у вашој апликацији. Она приказује ваш онлине / оффлине статус, омогућава вам да очистите или освежите кеш, деинсталирате радника услуге, па чак и пребаците кеширање док тестирате. Не више копање кроз Цхроме ДевТоолс или ручно не регистровање радника услуге сваких пет минута. devMode Nekoliko stvari koje treba imati na umu То није магија, тако да ћете и даље морати да прилагодите свој манифест.јсон и отпремите иконе ако желите да инсталирате банере да изгледају добро. Ми кеширамо само ГЕТ захтјеве - без мутација или осетљивих ПОСТ података - и ако желите да промените ХТМЛ ТТЛ или друга правила кеширања, мораћете да подесите директно (за сада - долази конфиг систем). sw.js Али у смислу перформанси, утицај је минималан, а ако се нешто деси, повратни посетиоци ће видети повећање брзине од одговора у кешу. Šta je sledeće Putovnica uključuje podršku za TTL pravila zasnovana na konfiguraciji, push obaveštenja, pametnije strategije keša zasnovane na URL obrascima, integraciju sa ISR (Incremental Static Regeneration), pa čak i ugrađenu kontrolnu tablu za praćenje hit/mis metrike keša u realnom vremenu. Др ; Др Изградио сам јер сам радио ручно жичање сервисних радника и дебугирање сталног кеша у производњи. ради из кутије, добро се игра са најновијим функције, и помаже вашој апликацији да остане брза, инсталирајућа и отпорна - без оштећења вашег девера. next-pwa-pack Next.js Otvoren je izvor, možete ga isprobati ovde: <https://github.com/dev-family/next-pwa-pack](https://github.com/dev-family/next-pwa-pack) Користите га, вијте га, разбијте га - и реците ми шта мислите. Ostanite sakriveni!
