# Pixeloperationen in JavaScript + Bitmap-Erzeugung



## OnlyFoo (30. August 2007)

Hey,
 ich hab heute mal wieder Langeweile gehabt und mich ein wenig mit JavaScript beschäftigt.
 Dabei rausgekommen ist dies: http://theoneandonlyfoo.th.funpic.de/stuff/js-fractal.png

 Ich hab eine Klasse geschrieben, mit der pixelbasierte Grafiken ohne <canvas> Tag erzeugt werden können und diese dann in Bitmap-Dateien umgewandelt werden und über "data" ausgegeben werden. Das ganze läuft nur im Firefox (möglicherweise auch Mozilla, evnt auch Opera) und berechnet die Mandelbrotmenge in beliebiger Größe. Das fertige Bild kann man dann abspeichern. Würd mich über ein paar Kritiken und Kommentare freuen (auch hinsichtlich des JavaScript-Codes).

Link: http://theoneandonlyfoo.th.funpic.de/stuff/pixel.htm

Olli


----------



## FunkyMonkey (20. November 2007)

Du bist ein Genie!


----------



## OnlyFoo (20. November 2007)

=)           Danke


----------



## FipsTheThief (3. Januar 2008)

Ich schau hier eben zum ersten mal rein *schäm* aber da hauts mich aus den Socken !

MfG


----------



## hasta_jesaja (8. Februar 2008)

Awesome! 

Gute Arbeit


----------



## Durek (9. Februar 2008)

Uff, wusste gar nicht, dass das mit JavaScript überhaupt möglich ist  Aber allein die Preloader von JavaScript haun mich um ^^ ich mache mit JS/Ajax nur wenig und für mich ist es UNMÖGLICH sowas zu basteln  naja... cih lerne noch und kann wenigstens PHP xD


----------



## cr4shm4n (13. März 2008)

Toll!
Wie wärs, wenn man das zu einem Javascript-Benchmark ausweitet, also Zeitmessungen einbaut? Wenn du Lust hast, kannst du das ja mal machen, und wenn nicht, würde ich das auch gerne mit deiner Erlaubnis machen.


----------



## OnlyFoo (15. März 2008)

Meinet wegen tu das, ich werd das nicht machen... Ich hatte mal nen kleinen Timer drinne, um zu gucken welche meiner Möglichkeiten, das Ergebnis base64 zu kodieren die schnellste war...


----------



## cr4shm4n (15. März 2008)

Gut, dann werd ich jetzt mal deinen Timer suchen und sehen was ich draus machen kann.

Ich werd dann einige Tests mit verschiedenen Browsern durchführen. Der neue Firefox soll ja unglaublich schnell sein...


----------



## FipsTheThief (15. März 2008)

cr4shm4n hat gesagt.:


> *Der neue Firefox soll ja unglaublich schnell sein...*



Sry für Offtopic

Welcher die Version 3 ? 

Also der normale FF ist naja mit am langsamsten ... wenn Du einen schnellen Browser suchst nimm den Safari das ist wirklich der schnellste .

Hab mal ein Object Sort gebastelt , den Testcase mit 20k Objekten gefüllt und mit Quick Sort sortiert , Safari brauchte 9 Sekunden der FF kam gut auf 48 Sekunden nur der Opera ist mir da abgestorben. Aber bei < 5000 Objekten war der Opera immer schneller als der FF


----------



## cr4shm4n (15. März 2008)

So, die Zeitmessung ist jetzt drin. Ich hab auch noch Tests mit verschiedenen Firefox-Versionen und Opera durchgeführt. Vielleicht teste ich auch nochmal unter Linux und/oder mit anderen Browsern, vielleicht Konqueror.

Hier also die Ergebnisse:

Bildgröße 320x240


```
Firefox 2.0.0.12, keine Extensions
Fortschrittsanzeige erstellen, Vorbereitungen: 0.109s
Berechnung des Bildes: 5.782s
Einfügen des Bildes: 0.968s
Gesamtzeit: 6.859s

Firefox 2.0.0.12, mit Firebug
Fortschrittsanzeige erstellen, Vorbereitungen: 0.125s
Berechnung des Bildes: 6.843s
Einfügen des Bildes: 1.094s
Gesamtzeit: 8.062s

Firefox 3.0b4pre "Minefield", keine Extensions
Fortschrittsanzeige erstellen, Vorbereitungen:0.013s
Berechnung des Bildes: 3.588s
Einfügen des Bildes: 0.446s
Gesamtzeit: 4.047s

Firefox 3.0b4pre "Minefield", mit Firebug
Fortschrittsanzeige erstellen, Vorbereitungen: 0.014s
Berechnung des Bildes: 3.578s
Einfügen des Bildes: 0.459s
Gesamtzeit: 4.051s

Firefox 3.0b4, keine Extensions
Fortschrittsanzeige erstellen, Vorbereitungen: 0.011s
Berechnung des Bildes: 3.475s
Einfügen des Bildes: 0.451s
Gesamtzeit: 3.937s

Firefox 3.0b4, mit Firebug
Fortschrittsanzeige erstellen, Vorbereitungen: 0.012s
Berechnung des Bildes: 3.513s
Einfügen des Bildes: 0.447s
Gesamtzeit: 3.972s

Opera 9.26
Fortschrittsanzeige erstellen, Vorbereitungen: 0.078s
Berechnung des Bildes: 3.734s
Einfügen des Bildes: 0.766s
Gesamtzeit: 4.578s
```

Und dann noch mit der Bildgröße 800x600

```
Firefox 2.0.0.12, keine Extensions
Fortschrittsanzeige erstellen, Vorbereitungen: 0.688s
Berechnung des Bildes: 34.734s
Einfügen des Bildes: 9.016s
Gesamtzeit: 44.438s

Firefox 2.0.0.12, mit Firebug
Fortschrittsanzeige erstellen, Vorbereitungen: 0.813s
Berechnung des Bildes: 44.547s
Einfügen des Bildes: 9.531s
Gesamtzeit: 54.891s

Firefox 3.0b4pre, keine Extensions
Fortschrittsanzeige erstellen, Vorbereitungen: 0.077s
Berechnung des Bildes: 12.715s
Einfügen des Bildes: 3.451s
Gesamtzeit: 16.243s

Firefox 3.0b4pre, mit Firebug
Fortschrittsanzeige erstellen, Vorbereitungen: 0.075s
Berechnung des Bildes: 13.083s
Einfügen des Bildes: 3.53s
Gesamtzeit: 16.688s

Firefox 3.0b4, keine Extensions
Fortschrittsanzeige erstellen, Vorbereitungen: 0.065s
Berechnung des Bildes: 12.537s
Einfügen des Bildes: 3.45s
Gesamtzeit: 16.052s

Firefox 3.0b4, mit Firebug
Fortschrittsanzeige erstellen, Vorbereitungen: 0.065s
Berechnung des Bildes: 12.717s
Einfügen des Bildes: 3.521s
Gesamtzeit: 16.303s

Opera 9.26
Fortschrittsanzeige erstellen, Vorbereitungen: 0.563s
Berechnung des Bildes: 13.453s
Einfügen des Bildes: 15.593s
Gesamtzeit: 29.609s
```


----------

