Shadow DOM, Virtual DOM və adi DOM arasındakı fərq nədir?

Shadow DOM elementin strukturunu və stilini izolyasiya edir, əsas DOM daxilində müstəqil ağac yaradır. Bu, stil və məntiq sızmalarını qarşısını alır və təkrar istifadə olunan komponentlərin yaradılmasına imkan verir.

Virtual DOM yaddaşda yüngül DOM nümayişidir. Birbaşa real DOM ilə manipulyasiya etmək əvəzinə, dəyişikliklər əvvəlcə Virtual DOM-a tətbiq olunur. Sonra, alqoritm köhnə və yeni virtual ağacı müqayisə edir (diffing) və yalnız dəyişmiş yerləri (patching) real DOM-da yeniləyir. Bu, bahalı əməliyyatları azaldır və tez-tez yeniləmələrdə performansı artırır.

Adi DOM (Document Object Model) HTML sənədləri ilə qarşılıqlı əlaqə üçün API-dir. Sənədin strukturunu düyün ağacı kimi təmsil edir və proqramların məzmun, struktur və stilə daxil olmasına və onları dəyişdirməsinə imkan verir. Birbaşa manipulyasiya böyük dəyişikliklər zamanı səmərəsiz ola bilər.

Xüsusiyyət	Shadow DOM	Virtual DOM	Adi DOM
Təyinat	Struktur və stilin kapsüllənməsi	Yeniləmələrin optimallaşdırılması	HTML sənədləri ilə işləmək üçün API
Təmsil edir	Element daxilində iç-içə düyün ağacı	Yaddaşda yüngül DOM nümayişi	Əsl HTML sənədinin düyün ağacı
Mekanizm	İzolyasiya olunmuş alt ağac yaradılması	Diffing (müqayisə) və patching (yeniləmə)	Düyünlərin birbaşa manipulyasiyası
Əsas üstünlüklər	İzolasiya, ponovnu istifadə komponentləri	Tez-tez yeniləmələrdə performans	Sənədlə qarşılıqlı əlaqənin standart üsulu
İstifadə olunan yerlər	Web Components	React, Vue.js, Inferno və s.	Brauzərlər, API JavaScript-lər