Prasības: Pieprasot tīmekļa vietni, jums ir jāielādē daudz resursu, tīkla pieprasījumi ietekmē arī tīmekļa lapas renderēšanas ātrumu, kad lietotājs noklikšķina uz operācijas, lai ielādētu dažus resursus, var ietekmēt lietotāja pieredzi, tagad straujā interneta attīstība, joslas platums un satiksme vairs nav tik dārga, kā iepriekš ielādēt resursus vai iepriekš izveidot saikni ar mērķa serveri?
Iepriekšēja savienojuma izveide
Atslēgvārds priekšsavienojums elementa rekvizītiem ir mājiens pārlūkprogrammai, ka lietotājam var būt nepieciešami resursi no mērķa avota, lai pārlūkprogramma tos varētu izmantotUzlabojiet lietotāja pieredzi, preventīvi uzsākot savienojumus ar šo avotu。
iepriekšēja savienojuma izveide ļauj pārlūkprogrammai veikt vairākas darbības, pirms HTTP pieprasījums tiek oficiāli nosūtīts serverim, ieskaitot DNS izšķirtspēju, TLS sarunas, TCP rokasspiedienu, kas novērš turp un atpakaļ latentumu un ietaupa laiku lietotājam.
Iepriekšēja savienošana ir svarīgs optimizācijas līdzeklis, lai samazinātu turp un atpakaļ ceļu daudzos pieprasījumos - dažos gadījumos par simtiem vai tūkstošiem milisekunžu latentuma.
Tālāk ir sniegts piemērs, kā izmantot iepriekšēju savienojumu pakalpojumam Google Fonts, kurā, pievienojot fonts.gstatic.com pirmssavienojuma uzvedni, pārlūkprogramma nekavējoties uzsāks pieprasījumu, kas tiks izpildīts paralēli CSS pieprasījumam. Šajā scenārijā iepriekšējais savienojums novērš trīs RTT (turp un atpakaļ laiku) no kritiskā ceļa unSamazināts latentums par vairāk nekā pussekundi。
Sintakse ir šāda:
Dokumentācija:Hipersaites pieteikšanās ir redzama.
DNS prefetch izmanto DNS prefetch
Elementa atribūta atslēgvārds dns-prefetch ir brīdināt pārlūkprogrammu lietotājam, ka lietotājam var būt nepieciešams resurss no mērķa avota, lai pārlūkprogramma varētu uzlabot lietotāja pieredzi, preventīvi veicot DNS izšķirtspēju šim avotam.
DNS iepriekšēja iegūšana ļauj pārlūkprogrammai atrasties lapā, kamēr lietotājs pārlūkoPalaidiet DNS izšķirtspēju fonā。 Tādā veidā DNS izšķirtspēja tiek pabeigta, kad lietotājs noklikšķina uz saites, tādējādi var samazināt latentumu. Konkrētā URL DNS iepriekšēju iegūšanu var veikt, pievienojot rel="dns-prefetch" saites taga rekvizītiem, mēs iesakām apstrādāt Google fontus, Google Analytics un CDN.
"DNS pieprasījumiem ir ļoti maz joslas platuma datplūsmas, bet latentums var būt augsts, īpaši mobilajās ierīcēs. Iepriekšējas iegūšanas laikā norādītais DNS var ievērojami samazināt latentumu noteiktos scenārijos, piemēram, kad lietotājs noklikšķina uz saites. Dažreiz var samazināt pat vienas sekundes kavēšanos - Mozilla Developer Network"
Sintakse ir šāda:
Dokumentācija:Hipersaites pieteikšanās ir redzama.
Iepriekš ielādēta ielāde
Elementa rekvizīta iepriekšēja ielādes vērtība ļauj deklarēt iegūšanas pieprasījumu HTML formātā, norādot resursus, kas lapai drīzumā būs nepieciešami, un vēlaties sākt ielādi lapas dzīves cikla sākumā, pirms tiek startēts pārlūkprogrammas galvenais renderēšanas mehānisms. Tas nodrošina, ka tie ir pieejami agrāk un mazāk iespējams bloķēt lapas atveidošanu, uzlabojot veiktspēju. Pat ja nosaukumā ir termins load, tas neielādē un neizpilda skriptu, bet tikai ieplāno to lejupielādei un kešatmiņai ar augstāku prioritāti.
Iepriekšēja ielāde ir jauns tīmekļa standarts, kas kontrolē, kā tiek ielādēti konkrēti resursi, jauninājums uz apakšresursu iepriekšēju iegūšanu, kas tika novecojis 2016. gada janvārī. Šo <link> komandu var izmantot, piemēram, <link rel="preload">. Parasti vislabāk ir izmantot iepriekšēju ielādi, lai ielādētu svarīgākos resursus, piemēram, attēlus, CSS, JavaScript un fontu failus. To nedrīkst sajaukt ar pārlūkprogrammas iepriekšēju ielādi, kas tikai iepriekš ielādē HTML deklarētos resursus. Pirmsielādes direktīva faktiski pārvar šo ierobežojumu un ļauj iepriekš ielādēt resursus, kas definēti CSS un JavaScript, un ļauj pieņemt lēmumus par to, kad lietot katru resursu.
Iepriekšēja ielāde atšķiras no iepriekšējas iegūšanas ar to, ka tā koncentrējas uz pašreizējo lapu un ielādē resursus ar augstu prioritāti, savukārt iepriekšēja iegūšana koncentrējas uz resursu, kas tiks ielādēts nākamajā lapā, un ielādē ar zemu prioritāti. Ņemiet vērā arī to, ka iepriekšēja ielāde nebloķē loga ielādes notikumu.
Var iepriekš ielādēt daudzus dažādus satura veidus. Iespējamās rekvizītu vērtības ir:
audio: audio fails, ko parasti izmanto <audio>.
document: 旨在由<frame>或嵌入的 HTML 文档<iframe>。
iegult: <embed>elementā iegulamais resurss.
fetch: resurss, kuram jāpiekļūst, izmantojot fetch vai XHR pieprasījumu, piemēram, ArrayBuffer vai JSON fails.
font: 字体文件。
attēls: attēla fails.
objekts: elementā ieguldams <object>resurss.
script: JavaScript 文件。
style: CSS 样式表。
track: WebVTT 文件。
darbinieks: JavaScript tīmekļa darbinieks vai koplietošanas darbinieks.
Video: video fails, ko parasti izmanto <video>.
Sintakse ir šāda:
Dokumentācija:Hipersaites pieteikšanās ir redzama.
|
Publicēts 26.09.2022 21:45:08
|
|
|
|
Publicēts 28.09.2022 08:54:26
|
