Working Draft

Vanessa Otto, Peter Kröner, Hans Christian Reinl, Stefan Baumgartner, Christian »Schepp« Schaefer
undefined
Jan 25, 2011 • 1h 6min

Revision 11: HTML5 +Logo -5, Markup-Manipulation und IP-Adressen-Endzeit

Bei unserer Tonqualität ist es wie beim Google Linkjuice: Zählt man alle Beteiligten zusammen, kommt immer die Zahl 1 heraus. Während Markus nun also THX-Ultra-zertifiziert ist, zerbröselten unserem Gast Nico Brünjes, Frontendentwickler bei ZEIT ONLINE, reihenweise die Headsets unter den Fingern weg :( Schaunotizen W3C HTML5 Logo! Das ansonsten eher langweilige W3C überrascht mit einer Art Promotion-Aktion: Auf einer sehr schicken, modernen Seite präsentiert es ein Logo, das vielleicht von Superhelden, vielleicht von einem 3D-Würfel inspiriert ist. Dazu gibt es einen HTML5-Gummipunkt-Generator und ein T-Shirt. Wir finden’s gut und Nico hat sich direkt das T-Shirt bestellt. HTML is the new HTML5 Die WHATWG denkt die korrekte Namensgebung der HTML-Version-nach-HTML-4.01, formerly known as HTML 5, formerly known as HTML5, konsequent zu Ende und stellt fest: Die HTML-Spezifikation ist permanent im Fluss und macht keinen Halt bei Versionnummern, also weg mit der 5! Ab jetzt heisst die Spezifikation selbst nur noch HTML. Und HTML5 möge neuerdings ein Schlagwort für diejenige Generation Webanwendungen sein, die allem Web-Zwo-Nulligen nachfolgt. JavaScript und CSS als Techniken inklusive. Using CSS Selectors as Fragment Identifiers Der altehrwürdige Eric Meyer und Simon St.Laurent von O’Reilly Media haben einen inoffiziellen Draft online gestellt, in dem sie eine neue Sprungmarker (Fragment) Syntax im CSS-Selektor-Stil vorschlagen. So soll man beispielsweise mit folgender URL direkt zu dem zweiten Absatz einer Seite springen können: http://example.com/lorem.html#css(p:nth-child(2)). Learning from Twitter Dass man selbst mit jQuery noch großen Bockmist bauen kann, haben letzte Woche die Twitter-Programmierer bewiesen. Dumm war, dass sie behauptet hatten, es läge an der neuen jQuery-Version dass Twitter neuerdings so langsam geworden war. Das hat John Resig dazu animiert, sich deren Code genauer anzuschauen, und er hat dabei Grauenhaftes zu Tage gefördert. Hinter dem mobilen Proxy Unser Gast Nico Brünjes schrieb letzte Woche über eine sehr unangenehme Entdeckung, die er und sein Team von ZEIT ONLINE machten: Die mobilen Zugangsprovider manipulieren das HTML, JavaScript und CSS nach gutdünken um, und vor allem stillschweigend. Das geht dummerweise ganz und gar nicht zerstörungsfrei vonstatten. Mozilla plant Do-not-track-HTTP-Header Mozilla und Microsoft planen, den Browser mit einer zusätzlichen Header auszustatten, dem X-Tracking-Choice: do-not-track. Dieser soll immer dann gesendet werden, wenn der Benutzer von Inhalteanbietern nicht getrackt werden will. Das Ganze setzt allerdings voraus, dass die Gegenseite diesen Header auswertet und respektiert. Beim Diskutieren darüber kommt uns die Robinson Liste in den Sinn. Google will es in Chrome hingegen via Browsererweiterung lösen. ARPAgeddon (IPv4 Countdown) Unser Vorrat an IPv4-Adressen geht nun wirklich zur Neige. Knapp über 30 Millionen Adressen sind noch frei, 4,3 Milliarden sind in Gebrauch. Laut ARPAgeddon hält der verbliebene Vorrat noch für etwa eine Woche. Es wird also höchste Zeit, breitflächig auf IPv6 mit seinen 665 Billiarden möglichen IP-Adressen umzusteigen – auch wenn es vielleicht weh tun wird. KEINE Schaunotizen UglifyJS Neuer JavaScript-Minifizierer und -Beautifier (Gegenteil von ersterem), der auf node.js läuft und dadurch doppelt bis fünf mal so schnell arbeitet wie der YUI Compressor oder Googles Closure. Kommt im Gegensatz zu letzterem auch mit eval() und (dem bösen) with{} klar, und verfügt über eine Google Closure kompatible HTTP-API. Steckt auch im kommenden WebKit Webinspector
undefined
Jan 18, 2011 • 1h 21min

Revision 10: H.264 vs. WebM, Shadow DOM und w3fools.com

Für die potenziell sprengsatzhaltige Diskussion um Googles Entscheidung, den H.264-Codec aus Chrome zu entfernen, holten wir uns Gerrit van Aaken mit ins Boot. Wir hoffen, dass die Audio-Qualität langsam in den Bereich des Erträglichen vordringt. NEU und BREAKING: Es gibt jetzt auch mal testweise Kapitelmarken. Bisher leider nur im MP4-Format. Wenn das Feature ankommt und ihr beispielsweise Ogg fordert, kann ich auch das geschehen lassen. Viel Spaß mit der Folge! Schaunotizen HTML Video Codec Support in Chrome Google versetzt dem lizenzbehafteten H.264-Codec einen Hieb und kündigt an, ihn aus Chrome(ium) zu entfernen. Im Rahmen des daran entflammten Shitstorms haben sowohl Gerrit als auch Peter und Markus ein paar Gedanken und Fakten zusammengetragen. Mit diesem Wissen unter dem Arm reden wir über die MPEG LA, Googles Strategie, WebMs Aussichten, die Marktanteile der Browser, Hardware-Support auf mobilen Geräten und erwähnen das GIF-Patent. JavaScript Full Screen API, Navigation Timing and repeating CSS Gradients Fullscreen API wird in Webkit unterstützt werden. Hurra und Yippieh. photoshopetiquette.com Grundregeln für den Umgang mit PSDs beim Screendesign. Insbesondere an die lieben Printler gerichtet. IndexedDB in Firefox 4 Die aktuelle und hoffentlich letzte Beta mit der Nummer 9 führt unter anderem IndexedDB ein. Die Final ist für Ende Februar geplant. Außerdem drin: Harmony Proxies und JavaScript Compartments jQuery 1.5 Beta 1 released Kleinere Verbesserungen, vornehmlich ein Rewrite der Ajax-Funktionalitäten. Dojo 1.6 Release Notes Mit neuem LESS-angetriebenem Theme, einem IndexDB-Storage, Umstellung von dojo-Attributen im Markup à la dojoType auf HTML5-data-Attribute, Performanceverbesserungen in IE6 und 7 (dank einer Analyse des Codes mit dynaTrace) und Dokumentation zur Verknüpfung von Dojo mit RequireJS. What the heck is Shadow DOM? Elemente, die nicht im DOM auftauchen, aber trotzdem irgendwo sein müssen, ja, wo sind die? Im Shadow DOM! Im IE ist es wie so oft ein alter Hut. CSSOM, Vars, Mixins, etc. (=HTML Slides, zu navigieren per Cursortasten) Die immer wieder gewünschten Ermächtigungsgesetze von CSS. Genaugenommen gewünscht seit 1994 (nur anders). Inspiriert von so Frameworks wie LESS oder Turbine. w3fools.com Die geben der dreckigen w3schools.com Saures. Konstruktiver ist das (man kann sagen SEO-)Projekt PromoteJS. CSS3 gradients in Webkit … … werden syntaxmäßig an den Firefox angeglichen. KEINE Schaunotizen …weil wir darüber nicht sprechen konnten oder wollten (ja, wir sortieren knallhart aus!): Mobile Perf Steve Souders hat 2011 zu seinem Jahr der mobilen Performanceoptimierungen ausgerufen. Zum Start hat er dieses Bookmarklet gebaut, mit Hilfe dessen man sich auch in mobilen Browsern ein paar Werkzeuge zum Auswerten einblenden lassen kann. Flash 10.2 beta … bringt das hochinteressante Stage Video.
undefined
Jan 11, 2011 • 58min

Revision 9: DOM-Monster, Drupal 7 und 2.2250738585072011e-308

Erste Folge im neuen Jahr, zum ersten Mal zu viert, aber hoffentlich das letzte Mal mit Mülltonnen-Sound von meiner Seite. Ab nächster Woche laufe ich nämlich mit dem gleichen Headset auf, das z.B. auch von Tim Pritlove, Philip Banse oder Frank & Fefe benutzt wird. Achja, und das mit dem Normalisieren muss mir noch mal einer erklären. Ich krieg die Peter-Spur nie so laut, dass sie gleich ist wie die anderen. Schaunotizen Einsteiger-Tutorial zu CoffeeScript JavaScript mit Ruby-Syntax – kurz: CoffeeScript – ausführlich erklärt. Peter erwähnte noch das Buch Coders at work und seinen CoffeeScript-Blogeintrag DOM-Monster Eine Art PageSpeed/YSlow mit Fokus auf dem DOM; Nützlichkeits-Level eher so kann-man-mal-machen. Ebenso verhält es sich mit den zugehörigen Büchern. HTML5sec.org Die Website listet alle Stellen, an denen die Ausgabe ungefilterten User-Inputs doppelt vermeidenswert ist. IE9-Entwicklungsäste mit experimentellen Features Es gibt einen Build mit IndexedDB- und einen mit Websockets-Unterstützung. Drupal-CMS in Version 7 Module in den Core gehievt und das Backend verschönert; Guidos Artikel und 2h Technikwürze zu dem Thema PHP in eine Endlosschleife schicken … … wenn die Fließkommazahl 2.2250738585072011e-308 als solche verwendet wird.
undefined
Dec 21, 2010 • 1h 19min

Revision 8: CrankShaft, Treesaver und ControlJS

Die letzte Folge des Jahres. Ein Holzscheit in den wärmenden Kamin der nerdigen Weihnachtlichkeit, der uns über die Feiertage bringen soll, bis wir dann am 10.1. die nächste Sendung aufnehmen werden. Wer Anregungen für die neue Saison hat: Her damit! Hier übrigens ein Screenshot, der zeigt, wie ausdifferenziert unsere Betriebssystemwahl aussieht: Schaunotizen CrankShaft Eine neue JavaScript-Compiler-Infrastruktur für Chromes V8 JavaScript-Engine, die sie noch weiter beschleunigt. Dass das vermutlich ersteinmal so weitergeht mit diesen unglaublichen Leistungssprüngen, darüber philopsophiert JavaScript-Erfinder Bredan Eich in jener Folge A Minute with Brendan. Treesaver Ein Framework, welches Flipboard fürs Web nachbasteln möchte. XHTML 2.0-Dokumente wurden als W3C-Notes veröffentlicht Ein weiterer Tod des toten XHTML 2.0 HTML5 Extension for Windows Media Player Firefox Plug-in Microsofts Erweiterung für Firefox, die sich um H.264 Videos in HTML5-<video>-Verpackung kümmert – leider nur unter Windows 7. HTML5-Elemente im IE ohne JavaScript … sondern per XML-Namespaces zerstörungsfrei einbinden. Kann man auch serverseitig abfeiern. Peters schnell zusammengehackten Testcase findet Ihr hier. MySQL 5.5 Multicore-Unterstützung, InnoDB als Standard, Optimierbarkeit für SSDs, herber Geschwindigkeitszuwachs unter Windows ControlJS JavaScript-Lader in 496 Zeilen Code, der einem auch die Kontrolle über den Zeitpunkt des Parsens der nachgeladenen Scripte gibt. Warum das wichtig ist beschreibt Nicholas Zakas in seinem Fronteers-Video (und haut heute ein Posting zu den Nachteilen von ControlJS und LABjs raus). Link zu den im Gespräch erwähnten JavaScript-Webworkers: hier.
undefined
Dec 14, 2010 • 39min

Revision 7: Dateisystem, Android 2.3, Websockets-Protokoll-Glitch, CSS 2.1

Schepp fiel aus, Marc stand im Stau, also mussten Peter und ich uns die Themen eben zu zweit zur Brust nehmen. In Rekordzeit! Weil wir noch ein paar Themen haben, die wir gerne noch zusammen mit Schepp besprechen würden, andererseits aber dachten, dies sollte die letzte Sendung vor Weihnachten sein, fragen wir nun einfach in die Runde der Hörer: Wollt ihr nächsten Dienstag noch eine Sendung oder seid ihr da schon an den Weihnachtsbaum gekettet und mit Tannenbaumbesorgungen beschäftigt? Dann kamen noch Fragen nach einer Spendenmöglichkeit per Direktüberweisung; ohne Paypal. Wer also meine Kontodaten will, bekommt diese auf Anfrage per Mail. Schaunotizen Experimentelle Filesystem-API Zugriff auf eine Sandbox im Dateisystem. Webkit-Browser der neuen Android-Version 2.3 unter der Lupe Keine Websockets, keine DeviceOrientation, kein SVG Disabling Websockets for Firefox 4 Firefox und auch Opera nehmen den Support für Websockets aus den aktuellen Betas. Last Call Working Draft von CSS 2.1 And thus there was much rejoicing
undefined
Dec 7, 2010 • 1h 3min

Revision 6: Firebug 1.6, head.js, Adventskalender und alle sind krank

Marc Hinse, Peters geplante Aushilfe erkrankte leider kurzfristig, sodass der Schepp und ich das zu zweit schaukeln mussten. Bis auf mein Kopf und meine Stimme spielten auch alle Beteiligten mit. Schautnotizen Google Chrome 8 Nichts Interessantes, größtenteils Security-Updates und Bugfixes Firebug 1.6 Wir kommen etwas ins Reden, an welchen Stellen der Web Inspector noch dem Firebug hinterher ist. head.js Mehrere JavaScripts parallel laden lassen und dadurch das Blocken der restlichen Seite verhindern Water under Ice Dateiuploads mithilfe der File API und Web Sockets Webkrauts-Adventskalender: Löschen ist keine Lösung Warum CSS-Resets mit Vorsicht zu genießen sind calendar.perfplanet.com Adventskalender zu Performance-Optimierungs-Themen 24ways Webkrauts-ähnlicher Kalender auf englisch 17 Fragen zum JMStV Wir regen uns pflichtbewusst über den neusten Coup der Offline-Apologeten auf.
undefined
Nov 30, 2010 • 50min

Revision 5: iOS 4.2, Opera 11, Web Messaging und Kinect

Auf Gerrits Drängen hin, hab ich dieses mal das integrierte MacBook-Mikrofon zum Aufnehmen genutzt. Konkret bedeutet das, dass ich nun in einer Mülltonne zu sitzen scheine; meine scharfkantigen Atmungsaktivitäten stechen damit aber immerhin weniger ins Ohr. Schaunotizen Safari on iOS 4.2 Neben Web sockets und der Unterstützung der DeviceOrientation API sind vor allem die Typo-Neuerung interessant: @font-face jetzt mit TTF ober noch kein WOFF. Genaueres bei Gerrit. This one goes to eleven! Erste Beta von Opera 11. Alle Neuerungen im Changelog. Der Stuhlvergleich trifft immer noch zu. Technikwürze 146 unter anderem über Jetpack Mozilla-Projekt, das dazu beitragen soll, dass die Extensions-Installation unter Firefox weniger schmerzlich wird. Opera Mobile 10.1 Auch die mobile Version des Browsers erfährt ein wichtiges Update inkl. Geolocation-Unterstützung und ordentlichem JIT-Compiler. W3C Working Draft der Web Messaging API Webapplikationen über mehrere Browserfenster steuern. Beispielsweise geeignet für Peters Slideshow-Projekt. DepthJS Chrome-Plugin, mithilfe dessen man das Microsoft Kinect per JavaScript auf Websites ansprechen kann.
undefined
Nov 23, 2010 • 59min

Revision 4: Sencha Touch 1.0, IE9-JS und HTML5-Gaming

Peter war dieses mal nicht dabei; dafür aber @polarity. Robert hat sich in letzter Zeit verstärkt mit Game-Engines auf HTML5-Basis beschäftigt und ob der lahmen News-Situation diese Woche haben wir am Ende dann einfach noch einen generellen EInblick in das Thema gegeben. Schaunotizen Sencha Touch 1.0 Framework für mobile Webanwendungen wird als Final veröffentlicht. Turbine CSS-Framework von Peter und Schepp sass-lang Turbine-artiges CSS-Framework Less CSS Weiteres CSS-Framework Dead Code Elimination for Beginners Die Chakra genannte JS-Engine des IE9 verhält sich etwas risikoreich HTML-Validierungsdienst Validome wieder online Gammlig: Keine Unterstützung von HTML5 Last Call des WOFF-Schriftformats Ausführliches dazu bald in der neusten poly:logo-Folge (Folge wird bald veröffentlicht) Impact.js Interessante, noch unveröffentlichte HTML5 Game-Engine Akihabra Eine weitere Spiele-Engine Aves Engine Und noch etwas in der Richtung Biolab Disaster Kurzweiliges Jump’n’Run mit Canvas
undefined
Nov 16, 2010 • 1h 6min

Revision 3: FF4Beta7, F1 und Google Instant Previews

Es lief technisch erstaunlich reibungsfrei. Garageband habe ich als Aufnahmesoftware dieses Mal zum Teufel gejagt, was sich als richtige Entscheidung herausstellte. Nur bei der Skype-Verbindung gabs hier und da ein paar Aussetzer. Am Anfang vergangener Woche war erstaunlich wenig los. Mozilla legte dann aber noch nach und brachte die 7er Beta des Firefox 4 mit Hardware-Grafikbeschleunigung, Forms & File-API, Jägermonkey und Opentype-Featureunterstützung. Schaunotizen Mozilla F1 Mozilla bringt die Social-Media Share-Buttons als Plugin in den Firefox Mozilla Firefox 4 Beta 7: Releasenotes Aktuelle Beta mit einigen interessanten Neuerungen Jägermonkey Jägermonkey begleitet Tracemonkey als JavaScript-Interpreter für nichtperfekten Code Are We fast yet? Mozilla-Website zeigt die Besserungen der Firefox-JavaScript-Compiler als Benchmark-Graphen HTML5 Forms API Firefox zieht nach. Validierungen, Datepicker, neue Attribute etc. wie in Opera. W3C File API-Spec Dateien direkt mit JS manipulieren, ohne über den Server zu müssen. Three.js on Github JavaScript 3D-Framework ohne Kopfschmerzpotenzial Opentype-Feature-Support im FF4 Opentype-Funktionen auf low-levelige Art im CSS nutzen Google Instant Previews Nach Google Instant gibt es jetzt auch Vorschaubilder für die Google-Suche und so funktioniert das angeblich alles.
undefined
Nov 9, 2010 • 1h 6min

Revision 2: mod_pagespeed, Sub-Pixel-Positionierung und viel Hall

In der Premierenfolge hatten wir es noch nicht geschafft, jetzt hat es geklappt. In voller Besetzung haben wir nun auch inklusive Schepp gemeinsam unsere minderwertigen Mikrofone beschallt. Googles Apache-Modul mod_pagespeed als Ableger des Browser-Plugins PageSpeed, Web-Applikationen versus Browser-Applikationen, Featuredetection-basiertes Nachladen von Polyfills, Hardwarebeschleunigung in Chrome, Sub-Pixel-genaue Positionierung von Schrift im IE9, Adobes Bemühungen um Webtypografie und serverseitiges Canvas waren unsere Themen. Auf meiner Spur ist leider so viel Hall, dass ich zeitweise ernsthaft gezweifelt habe, ob wir die Folge wirklich auf die Öffentlichkeit loslassen sollen. Ihr seid aber hoffentlich schmerzresistent genug, um darüber hinwegzusehen – zumindest dieses mal noch. Ich hoffe, beim nächsten Mal habe ich die Problemquelle ausfindig gemacht. Da sich der Hall geradezu wie berechnet anhört, würde ich sogar vermuten, da hat der böse Steve seine Finger softwareseitig im Spiel … Schaunotizen mod_pagespeed CSS-JS-Booster Chalk-Webapp ausschließlich für das iPad poly:logo 003: Webapplikationen yepnope.js – A Feature-Test Based Loader For Your Polyfills! HTML5Boilerplate GPU-accelerated compositing in Chrome Sub-Pixel-genaue Positionierung von Schrift im IE9 Adobe’s enhancing WebKit for better typography jQSlickWrap hyphenator.js node-canvas: Canvas für node.js CRE167: node.js

The AI-powered Podcast Player

Save insights by tapping your headphones, chat with episodes, discover the best highlights - and more!
App store bannerPlay store banner
Get the app