Sonntag, 13 April 2008 21:37 - Geschrieben von René Lindhorst
Wer kennt ihn nicht, den guten alten Super Mario, Nintendos wohl bekannteste Videospiel-Figur. Jacob Seidelin hat als einen Proof-of-Concept dem kleinen Klempner mithilfe von JavaScript neues Leben eingehaucht.
Das Besondere an seiner Implementierung ist, dass sämtliche Grafiken zur Laufzeit gerendert werden. Dabei wird ein Großteil des ersten Levels durch eine gerade einmal 14kB große JS-Datei realisiert.
Here’s an experiment in keeping things small and confined to one Javascript file. There are no external image files or anything, everything is rendered with Javascript using either canvas elements or old fashioned div-making tactics (for IE). The sprites are stored in custom encoded strings in a format that only allows 4 colors for each sprite but in turn only takes up around 40-60 bytes per sprite.
[nihilogic: Super Mario in 14kB Javascript]
Selbst der (etwas eintönige) Sound des Spiels stammt nicht etwa aus einer externen Musik-Datei. Er ist bereits Base64-Kodiert in der JS-Datei enthalten. Das finde ich wirklich sehr gut gelöst.
aSounds = [
// very small, very simple mario theme. Sequenced by Mike Martel."data:audio/mid;base64,TVRoZAAAAAYAAQAEAMBNVHJrAAAAGQD/
UQMFe3EA/1gEBAIYCAD/WQIAAAD/LwBNVHJrAAABqwD/AwRCYXNzAP8gAQAAsAdh
AMAjhgCQJGGCHoAkQAeQK1qCB5AwXAeAK0CBUZApVQSAMECCJJAwWQmAKUCCD5ApVwG
Wer das Spiel einmal selbst ausprobieren möchte, der findet die Variante mit Ton auf dieser Seite. Viel Spaß dabei!
(via Nerdcore)
Links:
Super Mario in 14kB Javascript – nihilogic
Ähnliche Beiträge:
Montag, 7 April 2008 20:10 - Geschrieben von René Lindhorst
Einen sehr interessanten Artikel zum Thema Webapplikationen für den Desktop gibt es bei TechCrunch. Man bekommt einen guten Überblick über Mozilla Prism, Adobe AIR, Fluid sowie Google Gears und die Unterschiede zwischen den verschiedenen Projekten.
New platforms like Adobe Air and Mozilla Prism are evolving that combine the benefits of Internet flow with the flexibility and power of desktop applications. They are part browser, part desktop app and are extremely efficient for certain types of applications.
Flash, Silverlight and Ajax get most web applications over the hump in terms of usability and are the technologies behind the fast transition of desktop applications to the web. But it’s not clear that they’ll ever kill off all desktop applications entirely. The bridge between them may very well be Air and/or Prism.
[Bridging Desktop And Web Applications - A Look At Mozilla Prism]
Passend dazu wurde heute im Google Operating Systems Blog eine Übersicht über aktuell verfügbare Google Gears Anwendungen veröffentlicht.
Links:
TechCrunch – Bridging Desktop And Web Applications
Google Operating Systems – List of Web Applications That Use Google Gears
Ähnliche Beiträge:
Dienstag, 1 April 2008 21:15 - Geschrieben von René Lindhorst
Auf Webseiten werden häufig Captchas, im Allgemeinen Bild-Captchas, eingesetzt um zu ermitteln, ob die Eingaben wirklich von einem Menschen stammen. Auf diese Weise sollen z.B. automatisierte Spam-Kommentare und Content-Diebstahl verhindert werden.
Ein Captcha (Completely Automated Public Turing Test to Tell Computers and Humans Apart) soll Menschen von Softwarerobotern (Bots) unterscheiden. Dazu dienen häufig Bilder, aus denen der Anwender versteckte Buchstaben und Zahlen in ein Textfeld übertragen muss. Obwohl wesentlich bessere Captcha-Verfahren existieren, halten sich die Bildchen hartnäckig.
[...]
Ein ideales Captcha erfüllt folgende Bedingungen [Turing-Test]:
- Heutige Computer können den Test nicht lösen.
- Menschen können ihn (meistens) lösen.
- Es lassen sich neue Frage-Antwort-Kombinationen generieren.
- Menschen sollen den Test in möglichst kurzer Zeit lösen.
[...]
Die Zwickmühle bei der Verbesserung der Bild-Captchas ist schnell erklärt: Je aufwendiger es für den Computer ist, die Informationen zu erkennen, desto größer auch die Schwierigkeiten für Menschen.
[iX 4/2008, S. 120: Webprogrammierung]
Ähnliche Beiträge:
Sonntag, 30 März 2008 19:01 - Geschrieben von René Lindhorst
Wer kennt das Problem mit den Zwangsregistrierungen auf Webseiten nicht. Häufig muss man sich auf einer Seite erst registrieren, um auf sie überhaupt zugreifen zu können oder um spezielle Funktionen wie z.B. die Suche zu nutzen. Typische Beispiele für solche Internetseiten sind Foren und Download- oder Video-Portale.
Wenn man solch eine Seite jedoch nicht regelmäßig nutzt oder sich einfach das Ausfüllen des Anmeldeformulars ersparen möchte, dann lohnt sich meist ein Blick auf BugMeNot.com. Dort sind für wirklich viele Webseiten entsprechende Login-Daten hinterlegt und durch eine recht große Community wird die Datenbank regelmäßig aktualisiert und erweitert.
BugMeNot.com was created as a mechanism to quickly bypass the login of web sites that require compulsory registration and/or the collection of personal/demographic information (such as the New York Times).
[Bugmenot.com]
Für Firefox-Anwender gibt es sogar eine spezielle Erweiterung die den Zugriff auf die bei BugMeNot.com hinterlegten Login-Daten noch einfacher macht.
Links:
Bugmenot.com
BugMeNot – Firefox Add-on
Ähnliche Beiträge:
Samstag, 29 März 2008 15:49 - Geschrieben von René Lindhorst
Es gibt bekanntlich verschiedene Plug-ins für Safari und Firefox die sich um das blockieren von unerwünschter Werbung auf Webseiten kümmern. Eine Alternative dazu wird bei floppymoose.com vorgestellt. Dort wird gezeigt wie man mithilfe von CSS-Regeln Werbung ausblenden kann. Eine fertige userContent.css-Datei mit entsprechenden Regeln wird zum Download angeboten. Diese kann sowohl bei Gecko-basierten Browsern wie Firefox und Camino genutzt werden, als auch bei Apples Safari und ebenso beim E-Mail-Programm Thunderbird.
If you know a little HTML and CSS, here’s how the rules in my userContent.css work. One of the CSS rules in the file has a set of selectors that look like A:link[HREF*="ad."] IMG and a rule that looks like { display: none ! important }. This selector is CSS’s way of saying Find all the images that are wrapped in links, where the link takes me to a url that has “ad.” somewhere in it. The rule is CSS-speak for Don’t display that image.
Then there are similar selectors paired with a rule that hides ad IFRAMES as well.
[Ad Blocking for Mozilla, Netscape 7, and Safari]
Um diese CSS-Regeln mit Safari zu nutzen empfiehlt es sich wie folgt vorzugehen:
- userContent.css herunterladen und z.B. unter ~/Library/Safari/ ablegen
- Einstellungen von Safari öffnen
- im “Erweitert”-Tab bei “Style Sheet” die userContent.css auswählen
(via Hackszine.com)
Links:
floppymoose.com
Ähnliche Beiträge:
