Rysowanie w JavaScript
to nowy element wprowadzony w specyfikacji HTML5. Umożliwia on utworzenie w dokumencie obszaru, na którym można następnie rysować za pomocą języków skryptowych (głównie JavaScript).Jakiś czas temu postanowiłem zobaczyć jak działa to w praktyce, a przy okazji przekonać się czy i jakie różnice szybkości i płynności wystąpią w przypadku uruchamiania skryptów w różnych przeglądarkach. W tym celu napisałem dwa skrypty. Pierwszy wykreśla w oknie przeglądarki najsłynniejszego z fraktali - Zbiór Mandelbrota. Drugi to prosta animacja 3D. Skrypty uruchomiłem w czterech najpopularniejszych przeglądarkach: IE 9, Operze 11.61, Firefoxie 9 i Chromium 16. Akceleracja sprzętowa w każdym przypadku była wyłączona.
Parametry sprzętu:
Procesor: AMD Athlon (tm) II P320 Dual-Core 2.10 GHz Pamięć: 3 GB DDR3 Karta graficzna: ATI Radeon HD 4250 System: Windows 7 64‑bit
Różnice prędkości widoczne są szczególnie w przypadku skryptu wykreślającego Zbiór Mandelbrota. Wyniki wyglądają następująco:
IE9 - 4088 ms. Opera - 5190 ms. Chromium (SRWare Iron 16) - 6295 ms. Firefox 9 - 9186 ms.
W drugim przypadku, ze względu na charakter skryptu, różnice są bardziej subtelne, ale również da się zauważyć, że Firefox jest najwolniejszy a IE 9 najszybszy. Wydaje się także, że animacja wygląda nieco płynniej w przypadku IE i niż w przypadku Firefoxa, Opery i SRWare Iron.
Jeśli ktoś ma ochotę zobaczyć jak skrypty działają w praktyce, podaję linki:
Połączenie elementu
