Rumah  >  Artikel  >  hujung hadapan web  >  Apakah kegunaan dom maya bertindak balas

Apakah kegunaan dom maya bertindak balas

WBOY
WBOYasal
2022-06-28 15:51:252092semak imbas

Penggunaan dom maya bertindak balas: 1. Tingkatkan prestasi kod tindak balas ialah objek js Prestasi yang digunakan dengan mencipta objek js adalah jauh lebih kecil daripada mencipta DOM sebenar DOM sebenar, buat DOM maya akan mempunyai peningkatan prestasi yang besar 2. Untuk mencapai aplikasi silang, pada bahagian pelayar, DOM maya ditukar menjadi nod DOM pelayar satu demi satu, atau ia boleh ditukar menjadi komponen. aplikasi asli untuk mencapai aplikasi terminal silang.

Apakah kegunaan dom maya bertindak balas

Persekitaran pengendalian tutorial ini: Sistem Windows 10, bertindak balas versi 17.0.1, komputer Dell G3.

Apakah kegunaan dom maya bertindak balas

1 sangat meningkatkan prestasi

2. Di bahagian penyemak imbas, DOM maya ditukar menjadi nod DOM penyemak imbas individu. Ia juga boleh ditukar kepada komponen aplikasi asli, dan aplikasi segmen silang boleh direalisasikan.

Mengapa ia boleh meningkatkan prestasi

Jika tiada DOM maya, maka DOM sebenar akan dibuat secara langsung Setiap kali data berubah, DOM sebenar akan dibuat dibuat, dan kemudian Bandingkan DOM sebenar, dan kemudian ubah suai DOM sebenar Mencipta DOM sebenar memerlukan banyak prestasi (kerana JS menjana pepohon DOM akan memanggil API peringkat aplikasi web, dan kehilangan prestasi tahap API ini. adalah sangat besar), jadi Ia akan menggunakan banyak prestasi.

Ia berbeza dengan DOM maya ialah objek js menggunakan prestasi yang lebih rendah daripada mencipta DOM sebenar Peningkatan prestasi yang besar.

DOM maya

DOM maya ialah objek js

<div id=&#39;abc&#39;><span>hello world</span></div>//真实DOM
[&#39;div&#39;, {id: &#39;abc&#39;}, [&#39;span&#39;, {}, &#39;hello world&#39;]]//虚拟DOM

Proses pemuatan dan kemas kini halaman

1.nyatakan data

Templat 2.jsx

3. Templat data menjana DOM maya

4. Gunakan DOM maya untuk menjana DOM sebenar

5.perubahan keadaan

6. Templat data menjana DOM maya baharu

7 Bandingkan DOM maya asal dan DOM maya baharu (algoritma perbezaan)

8 tukar Tempat yang sama

Pengetahuan yang diperluaskan:

Apakah tujuan DOM maya?

Untuk mencapai kemas kini elemen DOM yang cekap dalam halaman

Dalam aplikasi Web tradisional, kami sering mengemas kini perubahan data kepada antara muka pengguna dalam masa nyata, jadi setiap kali Small; perubahan dalam data akan menyebabkan pepohon DOM dipaparkan semula.

Tujuan DOM maya adalah untuk mengumpul semua operasi, mengira semua perubahan secara statistik dan mengemas kini DOM secara seragam.

Mempertingkatkan prestasi dengan hebat

Ia mendayakan aplikasi silang (React Native). Di bahagian penyemak imbas, DOM maya ditukar menjadi nod DOM penyemak imbas individu. Ia juga boleh ditukar kepada komponen aplikasi asli, dan aplikasi segmen silang boleh direalisasikan.

Perbezaan antara DOM dan DOM maya

1 DOM Maya tidak melakukan operasi penetapan huruf dan lukisan semula

2. Kemudian bandingkan dan ubah suai bahagian yang perlu diubah dalam DOM sebenar pada satu masa (nota!), dan akhirnya atur huruf dan lukis semula dalam DOM sebenar untuk mengurangkan kehilangan penataan dan lukisan semula nod DOM yang berlebihan

3, DOM sebenar Kecekapan tetapan taip dan lukis semula yang kerap adalah agak rendah

4 DOM Maya dengan berkesan mengurangkan lukisan semula dan tetapan taip kawasan besar (nod DOM sebenar), kerana pada akhirnya ia berbeza daripada DOM sebenar. , jadi hanya sebahagian daripadanya boleh diberikan

[Cadangan berkaitan:

tutorial video javascript, bahagian hadapan web]

Atas ialah kandungan terperinci Apakah kegunaan dom maya bertindak balas. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
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