Apakah kegunaan pramuat halaman web? Prefetch halaman web pramuat teknologi instant.page

Kelajuan memuatkan halaman web akan menjejaskan andaE-daganglaman web dalam enjin carianSEOKedudukan.

Apakah pramuat halaman web?

Terdapat teknik yang dipanggil prefetch yang sebenarnya adalah teknik pramuat.

• Apabila pengguna sengaja melawat halaman, penyemak imbas pramuat halaman tersebut.
• Apabila pengguna benar-benar mengklik pautan, pengguna terus membaca kandungan halaman daripada cache yang dipramuat dan mengurangkan masa muat halaman.
• Amazon dan lain-lain telah mendapati bahawa kependaman 100-milisaat menyumbang 1% daripada jualan, tetapi kependaman di web sukar untuk diatasi.

Prefetch halaman webApakah kegunaan pramuat?

instant.page menggunakan pramuat segera - ia pramuat halaman sebelum pengguna mengklik ▼

• Sebelum pengguna mengklik pautan, mereka menuding pada pautan.
• Apabila pengguna menuding selama 65ms, mereka akan mempunyai peluang untuk mengklik pada pautan, jadi instant.page mula pramuat pada ketika ini, dengan purata lebih 300ms untuk halaman pramuat.
• Pada peranti mudah alih, pengguna mula menyentuh paparan mereka sebelum dikeluarkan, mengambil purata 90ms untuk pramuat halaman.

Prefetch menjadikan halaman web dimuatkan dengan lebih cepat

• Otak manusia mengambil masa kurang daripada 100 milisaat untuk melihat sesuatu tindakan serta-merta.
• Oleh itu, teknologi pramuat instant.page boleh menjadikan tapak web anda berasa segera walaupun pada 3G (dengan andaian kelajuan pemaparan halaman anda adalah pantas).

Bagaimana untuk menyelesaikan pemuatan halaman web yang perlahan?

Halaman hanya dipramuat apabila terdapat kebarangkalian tinggi bahawa pengguna akan melawatinya, dan ia hanya pramuat HTML untuk halaman itu, menghormati lebar jalur dan CPU pengguna dan pelayan.

• Ia menggunakan pendengar acara pasif untuk memastikan halaman anda lancar.
• Ia tidak dipramuat apabila pengguna mendayakan perlindungan data (setakat versi 1.2.2).
• Ia 1 kB dan dimuatkan selepas semua yang lain.Ia adalah percuma dan sumber terbuka (lesen MIT).

Apakah kesan Prefetch halaman web pramuat instant.page?

Selepas menguji menambah kod instant.page, peningkatan dalam kelajuan akses tapak web masih agak besar.

• Secara lalai ia akan menapis untuk pramuat hanya pautan tapak ini dan tidak akan memuatkan pautan dari tapak lain.
• Apabila tetikus mengklik pada pautan artikel di sebelah kiri selama lebih daripada 65ms, Rangkaian akan pramuat halaman artikel.
• Apabila melayang kurang daripada 65ms, pramuat tidak dilakukan (bahagian merah)▼

Menggunakan instant.page akan meningkatkan PV tapak anda dengan ketara dan volum permintaan:

• Seorang rakan berkata bahawa purata kunjungannya bagi setiap lawatan ialah 13.84.
• Selepas digunakan, bilangan lawatan per kapita meningkat kepada 17.43, yang bersamaan dengan membuka 4 halaman lagi setiap orang.

Nota:

• Perlu diingatkan bahawa blogger yang menggunakan CDN berbayar dan membuka CDN tapak penuh harus berbuat demikian dengan berhati-hati.
• Tetapi jangan risau, pramuat hanya memuatkan halaman html, imej dan fail lain tidak, jadi tidak akan banyak kehilangan trafik.

Bagaimana untuk menggunakan teknologi pramuat halaman web?

Malah, terdapat atribut rel dalam teg pautan html5, salah satunya adalah prefetch, tetapi bilangan pengguna adalah kecil.

Instant.page yang diperkenalkan dalam artikel ini ialah skrip yang menggunakan teknik ini.

• Skrip ini akan menilai berdasarkan berapa lama pengguna mengarahkan tetikus pada pautan.
• Apabila ia mencecah 65ms, pengguna mempunyai separuh peluang untuk membuka pautan dan Instant.page pramuat halaman ini.

Pramuat halaman web kod skrip JS

1) Sediakan skrip JS secara rasmi dengan pecutan Cloudflare▼

Penggunaan instant.page adalah sangat mudah, cuma tambahkan kod berikut pada tapak web andaSejurus sebelum label.

<script src="//instant.page/5.2.0" type="module" integrity="sha384-jnZyxPjiipYXnSU0ygqeac2q7CVYMbh84q0uHVRRxEtvFPiQYbXWUorga2aqZJ0z"></script>

2) Kebebasan yang dihoskan sendiriChen WeiliangTawaran▼

• Skrip tinggal dalam pelayan, Instantclick-1.2.2.js, jadi anda tidak perlu risau tentang memperlahankan keadaan. 

Sila tambah kod berikut pada tapak web andaSejurus sebelum label:

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