niedziela, maja 02, 2010

Cieniowanie Gourauda w JavaScript :-)

[Update: parę godzin po tym poście udało mi się wszystko znacznie przyśpieszyć o czym można przeczytać w poście Cieniowanie Gourada w Java Script part 2 - przyśpieszamy :-), tutaj prędkości są od 5 do 10 razy wyższe :-)]Ciekaw byłem czy mi się to uda :-) i udało się :-)Na filmie poniżej można zobaczyć wyniki mojej próby przepisania cieniowania Gourada na JavaScript :-)
Jak widać wynik nie poraża prędkością ;-) 5, w porywach 6 klatek na sekundę na moim laptopie (procesor 2.2 GHz, 2 rdzeniowy, ale tutaj tylko 1 rdzeń jest używany) w Chrome 5.0.375.28 dev, w Firefoksie 1-1.5 klatki na sekundę. W Operze 10.50 wyniki są czasowo podobne do Chrome, ale jak to w Operze coś nie działa tak jak powinno, bo momentami twarz z animacji przypomina kosmitę, innym znów razem kolory się psują.Wszystko działa w oparciu o obiekt Canvas, a wszelkie obliczenia są dokonywane w JavaScript, nie używam tutaj żadnych przyspieszaczy w stylu WebGL.Jeżeli ktoś chciałby sprawdzić jak to działa u niego to wystarczy kliknąć Start Animation :-) Ale uwaga, jeżeli masz słaby komputer to może się okazać, że przeglądarka popadnie w katatonię.
[tutaj to samo, ale ciut większe [2 razy, z tym, że nie liczy się nic więcej, po prostu "pixele" mają rozmiary nie 1x1 a 2x2 :-)]]Sam kod w JavaScript powstał przez "przeportowanie" kodu z Java'y, który to kod w Java'ie powstał z przeprotowania kodu z C :-) [tutaj można zleźć applet w Java'ie który robi to samo co ten JavaScript].Całe portowanie zajęło mi łącznie z 4-6 godzin, może mniej, ale samą zabawę zacząłem tak gdzieś w połowie stycznia 2010, ale po dojściu gdzieś do 30-40% całej pracy zarzuciłem prace, by wrócić do nich dziś w nocy :-)Jak widać JavaScript powoli acz skutecznie staje się pełnoprawnym językiem programowania, choć trochę przeraża, że za jakiś czas może się okazać, że będziemy łączyć się z siecią by pobrać program w JavaScript, który będzie najpierw musiał się skompilować dla naszego procesora i dopiero wtedy nasz procesor będzie go wykonywać ;-)Jestem otwarty na głosy zachwytu ;-)


Podobne postybeta
Cieniowanie Gourauda w JavaScript part 2 - przyśpieszamy :-)
Nie taka Java wolna jak ją opisują...
Chrome, Firefox, IE9 preview i cieniowanie Gouraud'em w JavaScript
Android - nawet platofrma potrafi przeciwko Tobie knuć ;-)
WebGL - dalsze zabawy