Veebipistikud, veebitöötajad, teenindustöötajad… need on terminid, mida olete võib-olla lugenud või kuulnud. Võib-olla mitte kõik, kuid tõenäoliselt vähemalt üks neist. Ja isegi kui teil on esiotsa arendusega hea käepide, peate suure tõenäosusega uurima, mida need tähendavad. Või oled sa nagu mina ja segad neid aeg-ajalt. Kõik terminid näevad välja ja kõlavad kohutavalt sarnaselt ning neid on väga lihtne segamini ajada.
Niisiis, jagame need koos lahti ja eristame veebipesasid, veebitöötajaid ja teenindustöötajaid. Mitte selles mõttes, et sukeldume sügavalt ja saame igaühega praktilise kogemuse – pigem nagu väike abimees järgmisel korral järjehoidjate lisamiseks. I vajad värskendust.
Kiire viide
Alustame kiireks võrdlemiseks ja vastandamiseks kõrgetasemelise ülevaatega.
| tunnusjoon | Mis see on |
|---|---|
| Veebipesa | Loob avatud ja püsiva kahesuunalise ühenduse brauseri ja serveri vahel sõnumite saatmiseks ja vastuvõtmiseks ühe sündmuse käivitatud ühenduse kaudu. |
| Veebitöötaja | Võimaldab skriptidel töötada taustal eraldi lõimedes, et vältida skriptide üksteist peamise lõime blokeerimist. |
| Teenuse Tööline | Teatud tüüpi Web Worker, mis loob taustteenuse, mis toimib brauseri ja serveri vaheliste võrgupäringute haldamiseks vahevarana isegi võrguühenduseta olukordades. |
Veebipesad
Web Socket on kahesuunaline sideprotokoll. Mõelge sellele kui käimasolevale kõnele teie ja teie sõbra vahel, mis ei lõpe enne, kui keegi teist otsustab kõne katkestada. Ainus erinevus on see, et teie olete brauser ja teie sõber on server. Klient saadab päringu serverile ja server vastab kliendi päringu töötlemisega ja vastupidi.
Suhtlemine põhineb sündmustel. A WebSocket objekt luuakse ja ühendub serveriga ning serveri vahelised sõnumid käivitavad sündmused, mis neid saadavad ja vastu võtavad.
See tähendab, et esmase ühenduse loomisel on meil kliendi-serveri side, kus ühendus algatatakse ja seda hoitakse elus, kuni klient või server otsustab selle katkestada, saates CloseEvent. See muudab Web Socketsi ideaalseks rakenduste jaoks, mis nõuavad pidevat ja otsest suhtlust kliendi ja serveri vahel. Enamik definitsioone, mida olen näinud, kutsuvad vestlusrakendusi välja kui tavalist kasutusjuhtumit – sisestate sõnumi, saadate selle serverisse, käivitate sündmuse ja server vastab andmetega, ilma et peaksite serverit ikka ja jälle pingima.
Mõelge sellele stsenaariumile: olete teel välja ja otsustate Google Mapsi sisse lülitada. Tõenäoliselt teate juba, kuidas Google Maps töötab, kuid kui te seda ei tea, leiab see pärast rakendusega ühenduse loomist teie asukoha automaatselt ja jälgib seda kõikjal, kuhu lähete. See kasutab reaalajas andmeedastust, et jälgida teie asukohta seni, kuni see ühendus on elus. See on veebipesa, mis loob brauseri ja serveri vahel püsiva kahesuunalise vestluse, et hoida neid andmeid ajakohasena. Reaalajas tulemustega spordirakendus võib sel viisil kasutada ka Web Socketsi.
Suur erinevus Web Socketsi ja Web Workersi (ja laiemalt, nagu me näeme, Service Workersi) vahel on see, et neil on otsene juurdepääs DOM-ile. Kui veebitöötajad (ja teenindustöötajad) töötavad eraldi lõimedel, on Web Sockets osa põhilõimest, mis annab neile võimaluse DOM-iga manipuleerida.
Web Socketi ühenduste loomiseks ja hooldamiseks on olemas tööriistad ja teenused, sealhulgas: SocketCluster, AsyncAPI, kauboi, WebSocket King, Kanalidja Gorilla WebSocket. MDN-il on a jooksev nimekiri, mis sisaldab muid teenuseid.
Rohkem teavet veebipesade kohta
Veebitöötajad
Mõelge stsenaariumile, kus peate tegema hulga keerulisi arvutusi, tehes samal ajal DOM-i muudatusi. JavaScript on ühe lõimega rakendus ja rohkem kui ühe skripti käitamine võib häirida nii kasutajaliidest, mida proovite muuta, kui ka teostatavat keerulist arvutust.
Siin tulevad mängu veebitöötajad.
Veebitöötajad võimaldavad skriptidel taustal töötada eraldi lõimedes, et vältida skriptide üksteist peamise lõime blokeerimist. See muudab need suurepäraseks intensiivseid toiminguid nõudvate rakenduste jõudluse parandamiseks, kuna neid toiminguid saab teha taustal eraldi lõimedel, ilma et see mõjutaks kasutajaliidese renderdamist. Kuid nad ei pääse DOM-ile nii suurepäraselt ligi, sest erinevalt Web Socketsist töötab veebitöötaja oma lõimes väljaspool põhilõimi.
Web Worker on objekt, mis käivitab skriptifaili, kasutades a Worker ülesandeid täita. Ja kui me räägime töötajatest, siis kipuvad nad jagunema ühte kolmest tüübist:
- Pühendunud töötajad: Pühendunud töötaja on käeulatuses ainult seda kutsuva skripti abil. See täidab endiselt tüüpilise veebitöötaja ülesandeid, näiteks mitme lõimega skripte.
- Jagatud töötajad: Jagatud töötaja on pühendunud töötaja vastand. Sellele pääseb juurde mitu skripti ja see võib praktiliselt täita kõiki veebitöötaja ülesandeid, kui need on töötajaga samas domeenis.
- Teenindustöötajad: Teenindustöötaja toimib võrgupuhverserverina rakenduse, brauseri ja serveri vahel, võimaldades skriptidel käitada isegi siis, kui võrk läheb võrguühenduseta. Selle juurde jõuame järgmises jaotises.
Rohkem teavet veebitöötajate kohta
Teenindajad
On asju, mille üle me arendajatena kontrolli ei saa, ja üks neist on kasutaja võrguühendus. Ükskõik, millise võrguga kasutaja ühenduse loob, on see, mis see on. Saame ainult anda endast parima, et optimeerida oma rakendusi nii, et need toimiksid parimal võimalikul viisil mis tahes kasutataval ühendusel.
Teenindustöötajad on üks asi, mida saame teha, et rakenduse jõudlust järk-järgult parandada. Teenindustöötaja istub rakenduse, brauseri ja serveri vahel, pakkudes turvalist ühendust, mis töötab taustal eraldi lõime kaudu, tänu – arvasite ära – Web Workersile. Nagu viimases jaotises teada saime, on teenindustöötajad üks kolmest veebitöötajate tüübist.
Niisiis, miks te vajate kunagi teenusetöötajat, kes istuks teie rakenduse ja kasutaja brauseri vahel? Jällegi ei ole meil kontrolli kasutaja võrguühenduse üle. Oletame, et ühendus katkeb mingil teadmata põhjusel. See katkestaks side brauseri ja serveri vahel, takistades andmete edasi-tagasi edastamist. Teenindustöötaja hoiab ühendust, toimides asünkroonilise puhverserverina, mis suudab päringuid pealt kuulata ja ülesandeid täita – isegi pärast võrguühenduse katkemist.
See on peamine tõukejõud sellele, mida sageli nimetatakse "offline-first" arendus. Saame salvestada varasid võrgu asemel kohalikku vahemällu, anda olulist teavet, kui kasutaja läheb võrguühenduseta, hankida asju, et need oleksid valmis, kui kasutaja neid vajab, ja pakkuda võrgutõrgetele vastuseks varuvariante. Need on täielikult asünkroonsed, kuid erinevalt veebipesadest pole neil juurdepääsu DOM-ile, kuna nad töötavad oma lõimedel.
Teine oluline asi, mida teenusetöötajate kohta teada saada, on see, et nad võtavad kinni iga teie rakenduse päringu ja vastuse. Sellisena on neil teatud mõju turvalisusele, eelkõige see, et nad järgivad sama päritolu poliitikat. Seega tähendab see, et CDN-i või kolmanda osapoole teenusest ei kasutata teenindustöötajat. Need nõuavad ka turvalist HTTPS-ühendust, mis tähendab, et nende töötamiseks on vaja SSL-sertifikaati.
Rohkem teavet teenindustöötajate kohta
Pakke kuni
See on ülimalt kõrgetasemeline selgitus veebipesade, veebitöötajate ja teenindustöötajate vaheliste erinevuste (ja sarnasuste) kohta. Jällegi on terminoloogia ja mõisted piisavalt sarnased, et neid omavahel segada, kuid loodetavasti annab see teile parema ülevaate, kuidas neid eristada.
Alustasime asja kiire viitetabeliga. Siin on sama asi, kuid veidi laiendatud, et tuua paksemaid võrdlusi.
| tunnusjoon | Mis see on | Mitmelõimeline? | HTTPS? | DOM-i juurdepääs? |
|---|---|---|---|---|
| Veebipesa | Loob avatud ja püsiva kahesuunalise ühenduse brauseri ja serveri vahel sõnumite saatmiseks ja vastuvõtmiseks ühe sündmuse käivitatud ühenduse kaudu. | Töötab põhilõnga peal | Pole nõutud | Jah |
| Veebitöötaja | Võimaldab skriptidel töötada taustal eraldi lõimedes, et vältida skriptide üksteist peamise lõime blokeerimist. | Töötab eraldi lõimel | Nõutud | Ei |
| Teenuse Tööline | Teatud tüüpi Web Worker, mis loob taustteenuse, mis toimib brauseri ja serveri vaheliste võrgupäringute haldamiseks vahevarana isegi võrguühenduseta olukordades. | Töötab eraldi lõimel | Nõutud | Ei |
