Rumah > Artikel > hujung hadapan web > Apakah kaedah memuatkan malas?
Kaedah lazy loading termasuk malas memuatkan gambar, malas memuatkan video, malas memuatkan fail skrip, malas memuatkan data, dsb. Pengenalan terperinci: 1. Pemuatan malas imej ialah kaedah pelaksanaan pemuatan malas yang biasa Apabila halaman dimuatkan, hanya imej di kawasan yang boleh dilihat dimuatkan, dan imej di kawasan lain dipersembahkan dalam bentuk ruang letak apabila pengguna menatal halaman ke Imej sebenar dimuatkan apabila kedudukan imej ditentukan Pemuatan malas imej boleh dicapai dengan menggunakan perpustakaan JavaScript sedia ada atau kod tersuai 2. Pemuatan malas video dilaksanakan dengan cara yang sama dengan pemuatan malas imej, seperti apabila halaman sedang dimuatkan, dsb.
Sistem pengendalian tutorial ini: sistem Windows 10, komputer DELL G3.
Lazy loading ialah corak pengaturcaraan yang sering digunakan untuk mengoptimumkan pemuatan sumber dan prestasi halaman. Matlamat strategi ini adalah untuk memuatkan sumber atau data tertentu hanya apabila diperlukan, dengan itu mengelakkan memuatkan semua sumber pada permulaan untuk mengurangkan masa muat halaman dan meningkatkan prestasi halaman. Lazy loading biasanya digunakan untuk memuatkan sumber seperti imej, video, fail skrip dan data.
Terdapat beberapa kaedah pemuatan malas:
1. Pemuatan malas imej
Pemuatan malas imej ialah kaedah pemuatan malas yang biasa. Apabila halaman dimuatkan, hanya imej di kawasan yang boleh dilihat dimuatkan dan imej di kawasan lain dipersembahkan sebagai ruang letak. Apabila pengguna menatal halaman ke kedudukan imej, imej sebenar dimuatkan. Pemuatan malas imej boleh dilaksanakan menggunakan perpustakaan JavaScript sedia ada (seperti imagesLoaded) atau kod tersuai.
Langkah asas untuk melaksanakan pemuatan malas imej adalah seperti berikut:
(1) Masukkan imej ruang letak ke dalam halaman Saiz dan kedudukan imej pemegang tempat adalah sama dengan imej sebenar.
(2) Gunakan kod JavaScript untuk mendengar acara tatal dan menentukan kedudukan kawasan yang kelihatan semasa.
(3) Apabila pengguna menatal ke lokasi imej pemegang tempat, dapatkan URL imej sebenar melalui permintaan AJAX dan masukkan imej ke dalam halaman.
(4) Gunakan kod JavaScript untuk mendengar acara pemuatan imej Apabila imej dimuatkan, padamkan imej pemegang tempat.
2. Video pemuatan malas
Pelaksanaan pemuatan malas video adalah serupa dengan pemuatan malas imej Apabila halaman dimuatkan, hanya pemain video di kawasan yang kelihatan dimuatkan, dan kawasan lain dipaparkan dalam borang daripada pemegang tempat. Apabila pengguna menatal halaman ke kedudukan video, fail video mula dimuatkan. Melaksanakan pemuatan malas video boleh dicapai dengan menggunakan perpustakaan JavaScript sedia ada atau kod tersuai.
Langkah asas untuk melaksanakan pemuatan malas video adalah seperti berikut:
(1) Masukkan pemain video pemegang tempat ke dalam halaman Saiz dan kedudukan pemain video pemegang tempat adalah sama dengan pemain video sebenar.
(2) Gunakan kod JavaScript untuk mendengar acara tatal dan menentukan kedudukan kawasan yang kelihatan semasa.
(3) Apabila pengguna menatal ke lokasi pemain video pemegang tempat, dapatkan URL fail video sebenar melalui permintaan AJAX dan masukkan fail video ke dalam halaman.
(4) Gunakan kod JavaScript untuk memantau acara pemuatan fail video Apabila fail video dimuatkan, padamkan pemain video pemegang tempat.
3. Malas memuatkan fail skrip
Malas memuatkan fail skrip boleh melambatkan pemuatan fail skrip ke bahagian bawah halaman untuk mengelak daripada menyekat pemaparan halaman. Dengan menggunakan pendengar acara, fail skrip boleh dimuatkan hanya apabila diperlukan. Melaksanakan pemuatan malas fail skrip boleh dicapai dengan menggunakan perpustakaan JavaScript sedia ada atau kod tersuai.
Langkah asas untuk melaksanakan pemuatan malas fail skrip adalah seperti berikut:
(1) Masukkan tag pemegang tempat fail skrip di bahagian bawah halaman.
(2) Gunakan kod JavaScript untuk mendengar acara tertentu (seperti peristiwa klik Apabila peristiwa itu berlaku, dapatkan URL fail skrip melalui permintaan AJAX dan masukkan fail skrip ke dalam halaman).
(3) Gunakan kod JavaScript untuk memantau acara penyiapan pemuatan fail skrip dan laksanakan fungsi yang sepadan apabila fail skrip dimuatkan.
4. Malas memuatkan data
Malas memuatkan data hanya boleh memuatkan sebahagian daripada data apabila halaman dimulakan, dan hanya memuatkan data lain apabila pengguna memerlukannya. Kaedah ini boleh mengurangkan jumlah data untuk permulaan halaman dan meningkatkan prestasi halaman. Melaksanakan pemuatan data yang malas boleh dicapai dengan menggunakan perpustakaan JavaScript sedia ada atau kod tersuai.
Langkah asas untuk melaksanakan pemuatan data yang malas adalah seperti berikut:
(1) Masukkan bekas pemegang tempat untuk data ke dalam halaman.
(2) Gunakan kod JavaScript untuk mendengar acara tertentu (seperti acara tatal atau acara klik Apabila peristiwa itu berlaku, dapatkan URL data melalui permintaan AJAX dan masukkan data ke dalam halaman).
(3) Gunakan kod JavaScript untuk memantau acara penyiapan pemuatan data, dan laksanakan fungsi yang sepadan apabila pemuatan data selesai.
Atas ialah kandungan terperinci Apakah kaedah memuatkan malas?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!