Sebenarnya, ini adalah topik yang besar, tetapi saya tidak akan membincangkannya di sini kerana ia terlalu sukar - untuk memahami semua butiran, tidak cukup dengan hanya mengetahui Angular.
Untuk meringkaskan perkara utama, saya akan menyebut dua perkara:
Pra-penyusunan templat tidak sukar (di sini ia merujuk kepada caching templat statik ke$templateCache, supaya templat dimuatkan terus ke dalam ingatan apabila aplikasi dimuatkan), tetapi ia adalahserius untuk Angular Untuk rangka kerja yang bergantung pada pengikatan data, beban kerja penyusunan templat tidak patut disebut. Melainkan projek anda sangat besar dan terdapat terlalu banyak templat untuk diurus - tetapi yang lebih serius pada masa ini ialah kehilangan masa pra-penyusun templat semasa pembangunan tempatan - jadi memodulasi aplikasi gergasi adalah cara yang betul; intinya. Arahan seperting-repeatakan menjadi matlamat kami untuk "mengurangkan beban pada penyemak imbas", iaitu, mengembangkan arahan tersebut dan mengisi DOM sebelum pelayar dimuatkan arahan seperting-iftidak boleh dipraproses, kerana banyak kali ia bergantung kepada "pengikatan data". Izinkan saya memberi anda contoh, terdapat bahagian pada halaman yang dikawal olehng-ifIa dinilai berdasarkan sama ada pengguna semasa mempunyai keizinan Walau bagaimanapun, status sama ada pengguna mempunyai kebenaran untuk log masuk (atau syarat pratetap lain Dapatkan - Bagaimana kami memprosesng-ifdi luar penyemak imbas? Ia akan melibatkan operasi DOM, dan ia juga akan menjejaskan prestasi penyemak imbas Adakah anda maksudkan prapemprosesan atau tidak? Jika semua teg sedemikian memerlukan pertukaran untuk memutuskan sama ada akan dipraproses atau tidak, maka kosnya terlalu tinggi, jadi adalah lebih baik untuk tidak menggunakan Angular. Sudut tidak boleh statik sepenuhnya (by the way, ESNext'sObject.observe()akan menjadi kunci kepada penyelesaian), manakala separa statik mungkin, tetapi selalunya bukan kerana prestasi penyemak imbas.
Sebenarnya, anda harus percaya bahawa prestasi penyemak imbas moden adalah sangat kuat pemaparan sisi pelanggan bukanlah "kesesakan prestasi" yang dibayangkan oleh banyak orang pada pemaparan sebelah pelayan (untuk Angular). carian. Pengoptimuman enjin dan bukannya peningkatan prestasi. Izinkan saya memberi anda beberapa kata kunci untuk diselidik Ini adalah peluang yang baik untuk belajar (gunakan enjin carian bahasa Inggeris, tiada hasil yang berguna dalam bahasa Cina):
pemarahan sebelah pelayan
menjadikan dom pada bahagian pelayan
nod
bersudut
prapaparan
pra-kompil
phantomjs/casperjs
perpustakaan js isomorfik Anda boleh memisahkan dan menggabungkan kata kunci ini untuk meneroka kandungan yang berkaitan Terdapat banyak alat/amalan/tutorial/perbincangan menunggu anda untuk meneroka.
Untuk meringkaskan. Untuk aplikasi JS berdasarkan terutamanya pada "pengikatan data" (seperti Angular), kerana sokongan tahap bahasa dan persekitaran semasa tidak tersedia (sepertiObject.observe()yang disebutkan di atas, dll.), adalah mustahil untuk mencapai penyepaduan lengkap di Tahap DOM. Precompiled atau statik. Adalah mungkin untuk mempraproses bahagian DOM dengan cara lain sebelum memasuki penyemak imbas, tetapi ia tidak akan memberi kesan besar pada peningkatan prestasi keseluruhan aplikasi atau/dan peningkatan prestasi penyemak imbas, dan kos melaksanakan prapemprosesan ini itu sendiri tidak kecil; melainkan anda membuat permohonan dengan prestasi yang sangat ketat (seperti Taobao?), ia masih merupakan keputusan.
Sebenarnya, ini adalah topik yang besar, tetapi saya tidak akan membincangkannya di sini kerana ia terlalu sukar - untuk memahami semua butiran, tidak cukup dengan hanya mengetahui Angular.
Untuk meringkaskan perkara utama, saya akan menyebut dua perkara:
Pra-penyusunan templat tidak sukar (di sini ia merujuk kepada caching templat statik ke
$templateCache
, supaya templat dimuatkan terus ke dalam ingatan apabila aplikasi dimuatkan), tetapi ia adalahserius untuk Angular Untuk rangka kerja yang bergantung pada pengikatan data, beban kerja penyusunan templat tidak patut disebut. Melainkan projek anda sangat besar dan terdapat terlalu banyak templat untuk diurus - tetapi yang lebih serius pada masa ini ialah kehilangan masa pra-penyusun templat semasa pembangunan tempatan - jadi memodulasi aplikasi gergasi adalah cara yang betul; intinya. Arahan seperting-repeat
akan menjadi matlamat kami untuk "mengurangkan beban pada penyemak imbas", iaitu, mengembangkan arahan tersebut dan mengisi DOM sebelum pelayar dimuatkan arahan seperting-if
tidak boleh dipraproses, kerana banyak kali ia bergantung kepada "pengikatan data".Izinkan saya memberi anda contoh, terdapat bahagian pada halaman yang dikawal oleh
ng-if
Ia dinilai berdasarkan sama ada pengguna semasa mempunyai keizinan Walau bagaimanapun, status sama ada pengguna mempunyai kebenaran untuk log masuk (atau syarat pratetap lain Dapatkan - Bagaimana kami memprosesng-if
di luar penyemak imbas? Ia akan melibatkan operasi DOM, dan ia juga akan menjejaskan prestasi penyemak imbas Adakah anda maksudkan prapemprosesan atau tidak? Jika semua teg sedemikian memerlukan pertukaran untuk memutuskan sama ada akan dipraproses atau tidak, maka kosnya terlalu tinggi, jadi adalah lebih baik untuk tidak menggunakan Angular. Sudut tidak boleh statik sepenuhnya (by the way, ESNext'sObject.observe()
akan menjadi kunci kepada penyelesaian), manakala separa statik mungkin, tetapi selalunya bukan kerana prestasi penyemak imbas.Sebenarnya, anda harus percaya bahawa prestasi penyemak imbas moden adalah sangat kuat pemaparan sisi pelanggan bukanlah "kesesakan prestasi" yang dibayangkan oleh banyak orang pada pemaparan sebelah pelayan (untuk Angular). carian. Pengoptimuman enjin dan bukannya peningkatan prestasi. Izinkan saya memberi anda beberapa kata kunci untuk diselidik Ini adalah peluang yang baik untuk belajar (gunakan enjin carian bahasa Inggeris, tiada hasil yang berguna dalam bahasa Cina):
Anda boleh memisahkan dan menggabungkan kata kunci ini untuk meneroka kandungan yang berkaitan Terdapat banyak alat/amalan/tutorial/perbincangan menunggu anda untuk meneroka.
Untuk meringkaskan. Untuk aplikasi JS berdasarkan terutamanya pada "pengikatan data" (seperti Angular), kerana sokongan tahap bahasa dan persekitaran semasa tidak tersedia (seperti
Object.observe()
yang disebutkan di atas, dll.), adalah mustahil untuk mencapai penyepaduan lengkap di Tahap DOM. Precompiled atau statik. Adalah mungkin untuk mempraproses bahagian DOM dengan cara lain sebelum memasuki penyemak imbas, tetapi ia tidak akan memberi kesan besar pada peningkatan prestasi keseluruhan aplikasi atau/dan peningkatan prestasi penyemak imbas, dan kos melaksanakan prapemprosesan ini itu sendiri tidak kecil; melainkan anda membuat permohonan dengan prestasi yang sangat ketat (seperti Taobao?), ia masih merupakan keputusan.Dari perspektif pengoptimuman enjin carian, ini juga masuk akal. Alat sedia yang sesuai untuk AngularJS termasuk
prapaparan.io
angularjs-server
Pulau Midway Taobao sepatutnya menjadi titik permulaan yang serupa