Bagaimana Menangguhkan Memuatkan Fail CSS Besar untuk Prestasi Laman Web Dioptimumkan?

Patricia Arquette
Lepaskan: 2024-11-02 16:37:02
asal
612 orang telah melayarinya

How to Defer Loading Large CSS Files for Optimized Website Performance?

Tingkatkan Penghantaran CSS dengan Menangguhkan Pemuatan Fail CSS Besar

Dokumentasi Google untuk pembangun menasihatkan pengoptimuman penghantaran CSS untuk meningkatkan prestasi tapak web. Salah satu strategi yang disyorkan ialah menyelaraskan CSS kritikal di kepala, sambil memuatkan fail CSS asal yang lebih besar selepas halaman dimuatkan.

Memuatkan Fail CSS Besar Selepas Muat Halaman

Contoh yang disediakan mengendalikan dengan berkesan sebaris fail CSS yang kecil, tetapi meninggalkan persoalan tentang cara mendekati fail CSS yang lebih besar.

Untuk menangguhkan pemuatan fail CSS yang besar sehingga selepas halaman dimuatkan, anda boleh menggunakan coretan kod seperti berikut:

<code class="javascript">function loadStyleSheet(src) {
    if (document.createStyleSheet){
        document.createStyleSheet(src);
    }
    else {
        $("head").append($("<link rel='stylesheet' href='"+src+" />"));
    }
};</code>
Salin selepas log masuk

Cuma gunakan fungsi ini dalam fungsi $(document).ready() atau window.onload anda untuk mencapai pemuatan tertunda bagi fail CSS yang besar.

Alternatif lain ialah melumpuhkan JavaScript dalam penyemak imbas anda dan amati tingkah laku yang terhasil. Dengan berbuat demikian, anda boleh mengesahkan bahawa CSS dimuatkan secara tidak segerak, meningkatkan prestasi keseluruhan tapak web.

Ingat, melakukan carian Google yang pantas selalunya boleh memberikan cerapan berharga tentang cabaran pengaturcaraan. Sebagai contoh, pertanyaan "post load css" menghasilkan hasil yang berguna seperti yang dinyatakan dalam respons.

Atas ialah kandungan terperinci Bagaimana Menangguhkan Memuatkan Fail CSS Besar untuk Prestasi Laman Web Dioptimumkan?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan