Eine JavaScript-Engine ist ein Programm oder Interpreter, welches JavaScript-Code ausführen kann. Anwendung finden JavaScript-Engines meistens in Webbrowsern.

Einige der bekanntesten sind in der Tabelle aufgeführt:

V8

Die Chrome V8 oder einfach ausgedrückt V8, ist eine von Google entwickelte JavaScript-Engine. V8 kompiliert JavaScript direkt in nativen Maschinencode, bevor dieser ausgeführt wird. V8 ist für die Plattformen x86, ARM oder MIPS Architekturen ausgelegt (32- und 64-Bit).

Rhino

Rhino ist vollständig in Java geschrieben und wurde von der Mozilla Foundation entwickelt. Rhino kompiliert JavaScript in Java-Bytecode, kann diesen aber auch zur Laufzeit interpretieren.

SpiderMonkey

SpiderMonkey ist in C/C++ geschrieben und wurde von Netscape entwickelt. SpiderMonkey diente der Mozilla Foundation als Grundlage zur Entwicklung von Rhino.

JavaScriptCore

JavaScriptCore ist eine Abspaltung von KJS und wird von Apple weiterentwickelt. Vor der Ausführung wird JavaScript in Bytecode übersetzt, welches direkt zur Maschinensprache kompiliert.

KJS

KJS wurde ursprünglich von Harri Porten für den KDE Webbrowser Konqueror entwickelt.

Chakra

Chakra (JScript9) ist eine JavaScript-Engine, welche von Microsoft entwickelt wurde. ChakraCore (JavaScript) ist ein Teil von Chakra und ist eine JavaScript-Engine für den Microsoft Edge Browser. Chakra ist für die Plattformen x86/x64/ARM Architekturen ausgelegt.

Weiterführende Links

https://en.wikipedia.org/wiki/List_of_ECMAScript_engines
https://en.wikipedia.org/wiki/Chakra_(JScript_engine)
https://github.com/Microsoft/ChakraCore
https://developers.google.com/v8/
https://developer.apple.com/documentation/javascriptcore
https://en.wikipedia.org/wiki/Comparison_of_web_browser_engines
https://de.wikipedia.org/wiki/Rhino_(Programmierung)
https://developer.mozilla.org/de/docs/Rhino
https://github.com/alrra/browser-logos

XSS steht für Cross-Site-Scripting und bezeichnet das Ausnutzen einer Computersicherheitslücke in Webanwendungen. Auf der Seite xss-game.appspot.com befindet sich ein Spiel, welches verschiedene reale Szenarien abbildet, die anfällig für XSS sind.

Die Aufgabe besteht darin, die Sicherheitslücken zu finden und die jeweilige Anwendung anzugreifen.

Es warten sechs Level, die es zu lösen gilt.

• Level 1: Hello, world of XSS
• Level 2: Persistence is key
• Level 3: That sinking feeling…
• Level 4: Context matters
• Level 5: Breaking protocol
• Level 6: Follow the rabbit

Nach Bestehen der Aufgaben erhält der Spieler die Möglichkeit, sein Feedback abzugeben.

Ein sehr unterhaltsames Spiel und lehrreich zugleich. :)

Etwas Spaß für zwischendurch.

Hier gehts zur Live Demo.
Download: pixelMatrix.zip

Glückwunsch an unsere Nationalmannschaft zum Gewinn der WM 2014.

Damit der Browser auch komplett in den drei Farben glänzen kann, gibt es hier die entsprechende Seite dazu.

function mwFlagge() {
	var t = this;
	t.canvas = null;
	t.ctx = null;		//canvas context 
	t.y;

	t.run = function(){
		t.init();
	}

	t.init = function(){
		t.canvas = document.getElementById('main');
		t.calculate();
		t.ctx = t.canvas.getContext('2d');

		window.addEventListener("resize", function(e) {
			e.preventDefault();
			t.resize();
		}, false);

		draw();
	}

	t.calculate = function(){
		t.canvas.width = window.innerWidth;
		t.canvas.height = window.innerHeight;
		t.y = window.innerHeight / 3;		
	}

	t.resize = function() {
		t.calculate();
		draw();
	}

	function draw(){

		t.ctx.beginPath();
		t.ctx.fillStyle = "#000000";
		t.ctx.fillRect(0,0,window.innerWidth,t.y);

		t.ctx.fillStyle = "#DD0000";
		t.ctx.fillRect(0,t.y,window.innerWidth,t.y);

		t.ctx.fillStyle = "#FFCE00";
		t.ctx.fillRect(0,t.y*2,window.innerWidth,t.y*2);

		t.ctx.stroke();
	}
}

Hier gehts zur Live Demo.
Download: Flagge.zip

Ein kleines Vergnügen war die Erstellung des Hackeremblem bzw. des Glider aus dem Spiel “Conway’s Game of Life“. Zum Einsatz kam CSS, HTML5 und Canvas.

Hier gehts zur Live Demo.

Download: GliderAnimation.zip

This little jQuery script shows a solution for my next challenge.
It should be found, the parent form when the “bearbeiten” button was pressed.
After that, all the fields inside the form must be editable.

Live Demo: Click
Download Demo: Demo_001.zip

$(document).ready(function () {
   $("input:text").attr('disabled', 'disabled');
});

$('input:button[name="bearbeiten"]').click(function() {
   setEditable(this);
});

function setEditable(_this) {

   $(_this).closest("form").find("input:text").each(function(index, elem ) {
      $(elem).removeAttr('disabled');
   });
}

thanks goes to: A.K. ;)