która metoda jest najlepsza

Transkrypt

1 która metoda jest najlepsza dr inż. Marek Żabka Instytut Matematyki Wydział Matematyki Stosowanej Politechnika Śląska 20 września 2012r

2 Nowa metoda tworzenia grafiki na stronie internetowej: element,,canvas + JavaSript Można zadać pytania: Czy lepiej używać nowej metody czy raczej tradycyjnych? W jakich sytuacjach nowa metoda jest ewentualnie lepsza? Czy zależy to od przeglądarki?

3 Element,,canvas + JavaScript Język PHP pakiet,,gd2 Język C pakiet,,gd, (1) (1) z plikiem PHP użytym w roli pośrednika

4 Miejsce wykonania Canvas+JavaScript PHP Język C Klient Serwer Serwer Praca Bez kompilacji Bez kompilacji Po kompilacji Zależność od przeglądarki Alternatywa Możliwości powstawania stopniowego Duża, IE dopiero od IE9 Łatwo wstawić kod alternatywny Można tworzyć w krokach, widać postęp Niezależne Niezależne Automatycznie tekst (atrybut alt= napis ) Jednorazowo cały obrazek, potem następny ale cały od nowa.

5 1. Zwykłe, cienkie linie, okręgi oraz prostokąty w różnych kolorach 2. Grube linie, okręgi oraz prostokąty. Grubość zmienna 3. Rekurencyjne tworzenie grafiki 4. Fraktal, czyli dużo obliczeń + manipulacje na poziomie pikseli 5. Filtry graficzne (niestandardowe), też operacje na pikselach, różne głębokości barwne.

6 Serwer Xamp (oparty o Apache 2) Klient na tym samym komputerze 1) Google Chrome 21 2) IE 9 3) Firefox 14 4) Opera 12 5) Safari 5

7 Dla Canvas+JavaScript: Testy 1 do 4 po 16 razy na każdym kliencie Test 5 ma 3 wersje po 4 grafiki: 24b, 8b, 2b Każdą wersję wykonujemy po 16 razy (4 grafiki po 4 razy) Obliczamy średnie czasy Dla PHP oraz C Testy po 4 razy dla każdej z 5 przeglądarek, ale uśredniamy razem Łącznie uzyskujemy 7 x 7 serii wyników,

8 Strony startują automatycznie po załadowaniu Po zakończeniu pojedynczego testu, czas pracy jest zapisany w pliku, a potem automatycznie zostaje załadowana następna strona. Po zakończeniu testu na jedną przeglądarkę uruchomiony został test na następnej przeglądarce (prawie zawsze chodziła 1 przeglądarka + serwer) Czasy zostały uśrednione Komputer: 4 x Intel Core 2 Quad CPU 2,40 GHz Nvidia GeForce 9800GT RAM: 4 GB System: Windows 7 Professional (64bity) Indeks wydajności: 5,9

9 Język C powinien być najszybszy Języki JavaScript oraz PHP powinny być porównywalne

10 Sekundy Polega na rysowaniu losowo 5000 linii, okręgów oraz prostokątów Internet Serwer JavaSript 0 Google Chrome IE9 Firefox Opera Safari PHP C Zwraca uwagę ponad 10 krotna przewaga Google Chrome nad Firefox Program napisany w C jest kilkukrotnie wolniejszy od języka PHP

11 Sekundy 9 8 Polega na rysowaniu losowo 1000 linii, okręgów oraz prostokątów z losową grubością Internet Serwer JavaSript IE9 jest tu lepszy od Google Chrome Program napisany w C jest za wolny Problemem był tu brak prawidłowo rysowanych grubych linii w C oraz PHP zastosowane zostały wypełnienia prostokątów rysowanych 4 odcinkami oraz wielokrotne rysowanie okręgów o różnych promieniach 1 0

12 Tu test rekurencyjnego rysowania, 9 wywołań w głąb Internet Serwer JavaSript 0 Zwraca uwagę duży czas przesyłania obrazu w stosunku do jego uzyskania Tu najlepsza jest Opera

13 Rysowanie klasycznego fraktala Internet Serwer JavaScript Zbiór Mandelbrota Tu przeprowadzamy stosunkowo dużo obliczeń matematycznych Konieczny jest dostęp do pojedynczych pikseli Występuje wyraźna przewaga programu w języku C PHP odstaje (dostęp do pikseli łatwy, ale wolny) Tu z przeglądarek najlepszy jest Firefox

14 Przekształcenie obrazka (24 bity) praca na pikselach Internet Serwer JavaScript Praca na pikselach, tylko kopiowanie, bez obliczeń PHP bardzo wolny, wymagana lepsza biblioteka niż bgd Czas w przeglądarkach porównywalny do pracy w języku C Dla obrazów 8 bit. oraz 2 bit. czas dla języka C jest jeszcze krótszy

15 Proste rysunki linie kółka itd.: PHP lub JavaScript, PHP: Dane są na serwerze (np. w bazie) Konieczne zapisanie rys. JavaScript Dane są lokalne na przeglądarce Dane są zmieniane z natychmiastowym efektem Rysunku nie trzeba zapisać

16 Operacje na pikselach (np. filtry graficzne, fraktale) JavaScript lub język C JavaScript Ciekawią nas etapy powstawania efektu (nawet animacja) Zapis nie zawsze konieczny Dane są dostępne lokalnie Język C Zapis na serwerze Złożone obliczenia Konieczne dane z bazy

17 Warto pisać strony z elementem canvas+javascript Szybkość JavaScript jest często porównywalna z kompilowanym językiem C Ponieważ Internet Explorer dopiero od wersji 9 obsługuje canvas, więc trzeba przygotować wersje alternatywne. Stąd czasem warto pozostać przy PHP lub języku C W niedalekiej przyszłości element canvas+javasript może być często stosowaną technologią w Internecie.

18 Testy są dostępne na stronie: Tales.ms.polsl.pl/marek.zabka Warto by przeprowadzić dodatkowe testy z PHP inne nowsze biblioteki Flash

19