Aký je rozdiel medzi prvkami canvas a SVG?

canvas — rastrový obrázok, ktorý sa kreslí v reálnom čase pomocou API JS. Je riadený pixelmi. Používa sa na hry, grafy, animácie dát.

SVG — vektorový obrázok, opisuje sa v XML. Zväčšuje sa bez straty kvality. Je riadený objektmi (čiary, krivky). Používa sa na logá, ikony, ilustrácie. Ideálny pre responzívny dizajn.

Porovnanie Canvas a SVG:

Charakteristika	Canvas	SVG
Typ grafiky	Rastrová (pixelová)	Vektorová (založená na XML)
Vykreslenie	Pomocou API JavaScriptu	Opisuje sa v XML, vykresľuje prehliadač
Riadenie	Riadi jednotlivé pixely	Riadi objekty (čiary, tvary atď.)
Zväčšenie	Stráca kvalitu pri zväčšení	Zväčšuje sa bez straty kvality
Interaktivita	Vyžaduje dodatočnú logiku pre kliknutia	Vložená na úrovni objektov (cez DOM)
Výkon	Lepšie pre zložité, dynamické scény	Lepšie pre statické alebo menej zložité scény
Prístupnosť (Accessibility)	Ťažko zabezpečiť	Vložená (cez atribúty a DOM)
Použitie	Hry, zložité animácie, vizualizácia dát	Logá, ikony, ilustrácie, grafy