Ո՞րն է վեբ էջի նախնական բեռնման օգտագործումը: Վեբ էջի նախնական բեռնում instant.page տեխնոլոգիան

Վեբ էջի բեռնման արագությունը կազդի ձերԷլեկտրոնային առևտուրկայք որոնման համակարգումSEOվարկանիշը.

Ի՞նչ է վեբ էջի նախնական բեռնումը:

Կա մի տեխնիկա, որը կոչվում է prefetch, որն իրականում նախաբեռնման տեխնիկա է:

• Երբ օգտատերը միտումնավոր այցելում է էջ, զննարկիչը նախապես բեռնում է էջը:
• Երբ օգտատերը իրականում կտտացնում է հղումը, օգտվողն ուղղակիորեն կարդում է էջի բովանդակությունը նախապես բեռնված քեշից և նվազեցնում էջի բեռնման ժամանակը:
• Amazon-ը և մյուսները պարզել են, որ 100 միլիվայրկյան ուշացումը կազմում է վաճառքների 1%-ը, սակայն համացանցում ուշացումը դժվար է հաղթահարել:

Նախնական բեռնել վեբ էջըՈ՞րն է նախաբեռնման օգտագործումը:

instant.page-ն օգտագործում է ակնթարթային նախաբեռնում. այն նախապես բեռնում է էջը նախքան օգտագործողի ▼ սեղմելը

• Մինչ օգտվողը սեղմում է հղումը, նրանք սավառնում են հղման վրա:
• Երբ օգտատերը սավառնում է 65 մվ, նա հնարավորություն կունենա սեղմելու հղման վրա, ուստի instant.page-ը սկսում է նախապես բեռնվել այս պահին՝ միջինը 300 մվ-ից ավելի էջի նախաբեռնման համար:
• Բջջային սարքերում օգտատերերը սկսում են դիպչել իրենց էկրանին, նախքան թողարկումը, էջը նախապես բեռնելու համար պահանջվում է միջինը 90 մվ:

Prefetch-ը ստիպում է վեբ էջերն ավելի արագ բեռնել

• Մարդու ուղեղին 100 միլիվայրկյանից քիչ ժամանակ է պահանջվում՝ գործողությունն ակնթարթորեն ընկալելու համար:
• Հետևաբար, instant.page նախնական բեռնման տեխնոլոգիան կարող է ստիպել ձեր վեբ կայքին ակնթարթային զգալ նույնիսկ 3G-ում (ենթադրելով, որ ձեր էջի վերարտադրման արագությունը արագ է):

Ինչպե՞ս լուծել վեբ էջերի դանդաղ բեռնումը:

Էջերը նախապես բեռնվում են միայն այն դեպքում, երբ մեծ հավանականություն կա, որ օգտատերը կայցելի դրանք, և այն նախապես բեռնում է այդ էջի HTML-ը՝ հաշվի առնելով օգտագործողի և սերվերի թողունակությունը և պրոցեսորը:

• Այն օգտագործում է պասիվ իրադարձությունների ունկնդիրներ՝ ձեր էջերը հարթ պահելու համար:
• Այն նախապես բեռնված չէ, երբ օգտագործողը միացնում է տվյալների պաշտպանությունը (1.2.2 տարբերակով):
• Այն 1 կԲ է և բեռնվում է մնացած ամեն ինչից հետո:Այն անվճար է և բաց կոդով (MIT լիցենզիա):

Ի՞նչ ազդեցություն ունի Prefetch վեբ էջի նախնական բեռնումը instant.page:

Instant.page կոդը ավելացնելու փորձարկումից հետո կայքի մուտքի արագության բարելավումը դեռ համեմատաբար մեծ է:

• Լռելյայնորեն այն կզտվի միայն այս կայքի հղումները նախապես բեռնելու համար և այլ կայքերից հղումներ չի բեռնելու:
• Երբ մկնիկը սեղմում է ձախ կողմում գտնվող հոդվածի հղման վրա ավելի քան 65 մվ, Ցանցը նախապես կներբեռնի հոդվածի էջը:
• 65 մվ-ից պակաս սավառնելիս նախաբեռնումը չի կատարվում (կարմիր մաս) ▼

Instant.page-ի օգտագործումը զգալիորեն կբարձրացնի ձեր կայքի PV-ն և հարցումների ծավալը.

• Ընկերներից մեկն ասաց, որ իր այցելությունների միջին թիվը 13.84 է:
• Օգտագործելուց հետո մեկ շնչի հաշվով այցելությունների թիվը հասել է 17.43-ի, ինչը համարժեք է մեկ անձի համար ևս 4 էջ բացելուն։

注意 事项:

• Պետք է նշել, որ վճարովի CDN-ներ օգտագործող բլոգերները և բաց ամբողջական կայքի CDN-ները պետք է դա անեն զգուշությամբ:
• Բայց մի անհանգստացեք, նախապես բեռնում են միայն html էջերը, պատկերները և այլ ֆայլերը չեն բեռնում, ուստի երթևեկության մեծ կորուստ չի լինի:

Ինչպե՞ս օգտագործել վեբ էջի նախնական բեռնման տեխնոլոգիան:

Փաստորեն, html5-ի հղման թեգում կա rel հատկանիշ, որից մեկը prefetch-ն է, բայց սպառողների թիվը փոքր է։

Այս հոդվածում ներկայացված instant.page-ը սկրիպտ է, որն օգտագործում է այս տեխնիկան:

• Այս սկրիպտը կդատի՝ հիմնվելով այն բանի վրա, թե որքան ժամանակ է օգտատերը մկնիկը մկնիկը դնում հղման վրա:
• Երբ այն հասնում է 65 մվ-ի, օգտատերը ունի հղումը բացելու կես հնարավորություն, և Instant.page-ը նախապես բեռնում է այս էջը:

Վեբ էջի նախապես բեռնված JS սցենարի կոդը

1) Պաշտոնապես տրամադրեք JS սկրիպտներ Cloudflare արագացումով ▼

Instant.page-ի օգտագործումը շատ պարզ է, պարզապես ձեր կայքում ավելացրեք հետևյալ կոդըՊիտակի առաջ։

<script src="//instant.page/5.1.0" type="module" integrity="sha384-by67kQnR+pyfy8yWP4kPO12fHKRLHZPfEsiSXR8u2IKcTdxD805MGUXBz虚ni砖用wang络kLHw"></script>

2) ինքնատիրապետման ազատությունՉեն ՎայլյանԱռաջարկում ▼

• Սցենարն ապրում է սերվերում՝ Instantclick-1.2.2.js-ում, այնպես որ դուք ստիպված չեք լինի անհանգստանալ իրերի դանդաղեցման համար: 

Խնդրում ենք ավելացնել հետևյալ կոդը ձեր կայքումՊիտակի առաջ.

<script src="https://img.chenweiliang.com/javascript/instantpage.js" type="module"></script>