Cara pendekatan untuk pengoptimuman prestasi

Tujuan halaman ini adalah untuk menawarkan lebih banyak nasihat tentang cara menangani masalah pengoptimuman prestasi untuk tapak web pengeluaran.

Nampaknya anda cuba membahagikan ketulan berkas pada tapak web pengeluaran reaksi menggunakan React.lazy} andsuspense} dalam React; namun, ini tidak menghasilkan peningkatan yang dijangkakan dalam skor prestasi web anda.

Tetapi mengapa ia berlaku?

Memandangkan sesuatu tambahan diperlukan untuk tapak web pengeluaran anda.....

Baru-baru ini saya telah diberi tugas untuk meningkatkan prestasi laman web pengeluaran. Saya pada mulanya berpendapat bahawa kita harus memuatkan setiap laluan dengan lebih malas, tetapi saya tidak lama kemudian menyedari bahawa ini telah pun dilakukan.

Saya juga mula tertanya-tanya apa yang mungkin berlaku seterusnya.

Saya memasang pemalam penganalisis bundle webpack dan cuba menganalisis setiap bahagian selepas itu. Selepas itu, saya mempunyai banyak cadangan tentang cara meningkatkan prestasi.

Main.bundle.js
saiz berkas utama terlalu besar yang menyebabkan peningkatan dalam masa muat turun bersama-sama dengan masa penghuraian.

Bagaimana untuk memecahkan main.bundle.js?
dalam kes saya bundle utama saya mempunyai banyak json yang berkaitan dengan terjemahan yang semakin meningkat 1.5 MB saiz bundle utama.

Saya telah mengambil alih terjemahan menggunakan import malas daripada bundle main.js. Ini memberikan 40% pengoptimuman skor prestasi. tetapi ini belum selesai kerana kami mencapai skor prestasi rumah api 25 hingga 35 sahaja.

kemudian saya mula melihat fail besar lain yang berpotensi.

Salah satunya ialah moment js, yang mempunyai banyak tempat yang kami tidak gunakan untuk tapak web kami. Menggantikan moment js dengan pustaka ringan ialah satu cara untuk membetulkannya, tetapi berbuat demikian akan memerlukan lebih banyak pengubahsuaian kod dan meningkatkan beban kerja saya menguji keseluruhan tapak web—sesuatu yang belum pernah saya lakukan sebelum ini—yang boleh membawa kepada lebih banyak ralat. kemudian saya membuat keputusan untuk memikirkan cara untuk menyingkirkan kawasan yang tidak diingini itu; mujurlah, pemalam webpack telah tersedia. Saya dapat meminimumkan saiz fail moment.js dengan menggunakan pemalam itu [ContextReplacementPlugin].

Nantikan banyak lagi akan datang... Terima kasih

Atas ialah kandungan terperinci Cara pendekatan untuk pengoptimuman prestasi. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!