Working Draft

By Vanessa Otto, Peter Kröner, Hans Christian Reinl, Stefan Baumgartner, Christian »Schepp« SchaeferNews Technology Education How To Tech News

Working Draft episodes

January 30, 2016 Revision 251: Googles AMP und die Zukunft der Parallelität
Die Revision 251 ist auch wieder hochkarätig besetzt: Wir haben uns Malte Ubl von Google eingeladen um über AMP zu sprechen und uns erklären zu lassen, was es mit diesem Projekt auf sich hat.
Schaunotizen
[00:01:11] AMP
Um besser zu verstehen, was es mit Googles Projekt AMP auf sich hat, haben wir uns Malte Ubl, den Projektleiter mal eingeladen und uns erklären lassen, worum es geht. Maltes Artikel, warum AMP schnell ist. Ein weiterer Artikel zum Thema AMP ist hier zu finden. Ein WordPress Plugin gibt es auch.
[00:43:20] 2016 will be the year of concurrency on the web
WebWorker sind das neue heiße Ding und werden 2016 einen starken Aufschwung erleben, meint Malte. Wir unterhalten uns darüber, wie wir mit der Parallelität im Web umgehen.
[00:55:31] Keine Schaunotizen
Understand promises before you start using async/await
Dieser Artikel hilft, erst mal Promises zu verstehen, bevor man sich mit weiterer Asynchronität in ES2016 beschäftigt.
JavaScript web apps considered valuable
Ein Statement zum Thema JavaScript Applikationen.
Arialinter
Arialinter ist ein Tool, dass die Verwendung von Aria-Attributen überprüft.
Cycle.js Fundamentals – Course by @andrestaltz
Ein Video-Kurs zum Thema Cycle.js und Reactive Programming.
How to make your web app installable
Wer wissen möchte, was man tuen muss um Websites auf Smartphones app-ähnlich zu installieren, sollte diesen Artikel lesen.
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/
1 hr
January 30, 2016 Revision 251: Googles AMP und die Zukunft der Parallelität
Die Revision 251 ist auch wieder hochkarätig besetzt: Wir haben uns Malte Ubl von Google eingeladen um über AMP zu sprechen und uns erklären zu lassen, was es mit diesem Projekt auf sich hat.
Schaunotizen
[00:01:11] AMP
Um besser zu verstehen, was es mit Googles Projekt AMP auf sich hat, haben wir uns Malte Ubl, den Projektleiter mal eingeladen und uns erklären lassen, worum es geht. Maltes Artikel, warum AMP schnell ist. Ein weiterer Artikel zum Thema AMP ist hier zu finden. Ein WordPress Plugin gibt es auch.
[00:43:20] 2016 will be the year of concurrency on the web
WebWorker sind das neue heiße Ding und werden 2016 einen starken Aufschwung erleben, meint Malte. Wir unterhalten uns darüber, wie wir mit der Parallelität im Web umgehen.
[00:55:31] Keine Schaunotizen
Understand promises before you start using async/await
Dieser Artikel hilft, erst mal Promises zu verstehen, bevor man sich mit weiterer Asynchronität in ES2016 beschäftigt.
JavaScript web apps considered valuable
Ein Statement zum Thema JavaScript Applikationen.
Arialinter
Arialinter ist ein Tool, dass die Verwendung von Aria-Attributen überprüft.
Cycle.js Fundamentals – Course by @andrestaltz
Ein Video-Kurs zum Thema Cycle.js und Reactive Programming.
How to make your web app installable
Wer wissen möchte, was man tuen muss um Websites auf Smartphones app-ähnlich zu installieren, sollte diesen Artikel lesen.
1 hr
January 26, 2016 Revision 250: Achtung Baby!
For our 250th episode, we managed to get our greedy hands on no one less than Bruce Lawson from Opera. Having barely returned from a trip to Asia and still dizzy from his jetlag, we managed to extract a whole bunch of classified information on CSS Houdini out of him (also thanks to our German interview style). And a little bit more as well:
Show Notes
[00:02:01] Safari 9.1
We talked about the new Safari version, what features it brings, and how it looks like it’s the first installment of a new rapid release cycle.
[00:12:13] The CSS Houdini Project
Bruce told us what the purpose of CSS Houdini is, how at came to be, which parts it consists of, and when to expect first experiments shipping to us in a browser (maybe this year already!).
[00:37:50] Subgrids Considered Essential
Prompted by a blog post from Eric Meyer we discussed the current CSS Grids spec and how it is badly lacking a subgrids feature.
[00:51:18] Links
The web accessibility basics
Accessibility can never be overly discussed. Marco wrote a good roundup on how do accessibility basics right, and he also takes a glimpse at a few more advanced things.
Simple standalone toggletip widget pattern
Likewise, Steve Faulkner from the Partiello Group showcases a prototype for an accessible info tooltip widget.
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/
55 min
January 26, 2016 Revision 250: Achtung Baby!
For our 250th episode, we managed to get our greedy hands on no one less than Bruce Lawson from Opera. Having barely returned from a trip to Asia and still dizzy from his jetlag, we managed to extract a whole bunch of classified information on CSS Houdini out of him (also thanks to our German interview style). And a little bit more as well:
Show Notes
[00:02:01] Safari 9.1
We talked about the new Safari version, what features it brings, and how it looks like it’s the first installment of a new rapid release cycle.
[00:12:13] The CSS Houdini Project
Bruce told us what the purpose of CSS Houdini is, how at came to be, which parts it consists of, and when to expect first experiments shipping to us in a browser (maybe this year already!).
[00:37:50] Subgrids Considered Essential
Prompted by a blog post from Eric Meyer we discussed the current CSS Grids spec and how it is badly lacking a subgrids feature.
[00:51:18] Links
The web accessibility basics
Accessibility can never be overly discussed. Marco wrote a good roundup on how do accessibility basics right, and he also takes a glimpse at a few more advanced things.
Simple standalone toggletip widget pattern
Likewise, Steve Faulkner from the Partiello Group showcases a prototype for an accessible info tooltip widget.
55 min
January 17, 2016 Revision 249: Sauberes HTML, Gratis CDNs
Das ist doch alles kaputt. Entweder sind’s die eigenen Webseiten, die sich partout gegen Wissen und Gewissen wehren, oder gar ganze Dienste, die einem das Blaue vom Himmel für wenig bis gar kein Geld versprechen. Peter, Hans, Anselm und Stefan debattieren über „Gewollt Böse“.
Schaunotizen
[00:00:26] On Accessibility and the Lack of Proper HTML
Was bringt sauberes HTML wenn ein hingeschleudertes DIV ebenso funktioniert und dem gestreßten Webentwickler einiges an Nerven spart. Ja, sogar die Deadline einhalten lässt. Wie sieht der Gute Wille aus, und wie die bittere Realität. Was bringt es, Qualität in seinen Code bringen, wenn es der Benutzer am Ende sowieso nicht sieht. Wir nehmen Ian Devlins Artikel und den von Michiel Bijl als Anlass für die Diskussion.
[00:44:36] Choose Your Own HTTPS
Dienste wie Cloudflare versprechen HTTPS, HTTP/2, ein CDN, Super Caching und etliche andere Services, die Webseiten schneller, robuster und sicherer machen. Das alles zum Nulltarif. Das es nichts im Leben umsonst gibt, gibt’s natürlich einen Haken. Anselm klärt auf und zeigt die bittere Realität.
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/
1 hr 9 min
January 17, 2016 Revision 249: Sauberes HTML, Gratis CDNs
Das ist doch alles kaputt. Entweder sind’s die eigenen Webseiten, die sich partout gegen Wissen und Gewissen wehren, oder gar ganze Dienste, die einem das Blaue vom Himmel für wenig bis gar kein Geld versprechen. Peter, Hans, Anselm und Stefan debattieren über „Gewollt Böse“.
Schaunotizen
[00:00:26] On Accessibility and the Lack of Proper HTML
Was bringt sauberes HTML wenn ein hingeschleudertes DIV ebenso funktioniert und dem gestreßten Webentwickler einiges an Nerven spart. Ja, sogar die Deadline einhalten lässt. Wie sieht der Gute Wille aus, und wie die bittere Realität. Was bringt es, Qualität in seinen Code bringen, wenn es der Benutzer am Ende sowieso nicht sieht. Wir nehmen Ian Devlins Artikel und den von Michiel Bijl als Anlass für die Diskussion.
[00:44:36] Choose Your Own HTTPS
Dienste wie Cloudflare versprechen HTTPS, HTTP/2, ein CDN, Super Caching und etliche andere Services, die Webseiten schneller, robuster und sicherer machen. Das alles zum Nulltarif. Das es nichts im Leben umsonst gibt, gibt’s natürlich einen Haken. Anselm klärt auf und zeigt die bittere Realität.
1 hr 9 min
January 10, 2016Revision 248: ECMAScript 6 und 7
Mit Dr. Axel Rauschmayer als Gast haben wir das virtuelle Working Draft Studio kurzerhand in ein ECMAScript-Sprechzimmer umgewandelt.
Schaunotizen
[00:02:50] ECMAScript 6/7/2015/2016
Axel ist vor allem für seine umfassenden Forschungen zu den neuen Sprachstandards für JavaScript bekannt. In der Sprechstunde nehmen wir sämtliche neuen Sprachfeatures auseinander, reden über syntaktischen Zucker, neue Konzepte und Implementierungen. Außerdem gibt es noch folgendes:
Mixins zur Mehrfachvererbung in JavaScript
Generator-basierender Flow Control mit co
Infos zum TC39 Prozess
Aktuelle ECMAScript proposals und ihre Stufe
Infos zum TC39 Prozess von Axel selbst
Dieses Beispiel, das im Zusammenhang mit Destructuring und Iterables genannt wird:
let arr = ['a', 'b', 'c'];
for (let [k,v] of arr.entries()) {
console.log(`key = ${k}, value = ${v}`);
}
// Output:
// key = 0, value = a
// key = 1, value = b
// key = 2, value = c
Außerdem sprechen wir über das kommende ECMAScript 7, JavaScript Module, und warum die umstrittensten Sachen wie Klassen gleichzeitig zu den wichtigsten fürs JavaScript Ökosystem gehören. Für weitere Informationen empfehlen wir das ECMAScript 6 Buch sowie das Doctor’s Diary.
[00:39:54] RollupJS
RollupJS ist der neueste Schrei im Modul-Bundling. Hat aber auch einen Grund. Mit ECMAScript 6 Modulen und Technologien wie Tree Shaking kann er etwas, dass bisherige Modulbundler sträflich vernachlässigten: Nur das ins Bundle schmeissen, das man auch wirklich braucht. Der Doktor klärt auf. Auch hier und hier.
[01:03:20] Keine Schaunotizen
CDNs
Rodney kennt eine Menge CDNs, wo JavaScript Developer ihre Bibliotheken gut verteilen können:
RawGit (alles von GitHub)
BowerCDN (alles von Bower)
BrowserifyCDN (alles von NPM)
cdnjs
jsDelivr
TL:DR; Man Pages
Wenn Unix manuals zu geschwätzig sind, kommt man mit tldr schnell zu den Beispielen.
Do I Use
Node Tool, dass dir sagt ob du CSS Features verwendest, die deine zu unterstützenden Browser vielleicht gar nicht können.
Chrome CPU Throttling
Seit neuestem kann man in den Chrome (Canary) Dev Tools auch die CPU Leistung drosseln.
Exploring ES6
Das ECMAScript 6 Buch des Doktors.
Setting up ES6
Ein Addon zum vorigen Buch, das sich ums Tool-Setup kümmert.
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/
1 hr 12 min
January 10, 2016 Revision 248: ECMAScript 6 und 7
Mit Dr. Axel Rauschmayer als Gast haben wir das virtuelle Working Draft Studio kurzerhand in ein ECMAScript-Sprechzimmer umgewandelt.
Schaunotizen
[00:02:50] ECMAScript 6/7/2015/2016
Axel ist vor allem für seine umfassenden Forschungen zu den neuen Sprachstandards für JavaScript bekannt. In der Sprechstunde nehmen wir sämtliche neuen Sprachfeatures auseinander, reden über syntaktischen Zucker, neue Konzepte und Implementierungen. Außerdem gibt es noch folgendes:
Mixins zur Mehrfachvererbung in JavaScript
Generator-basierender Flow Control mit co
Infos zum TC39 Prozess
Aktuelle ECMAScript proposals und ihre Stufe
Infos zum TC39 Prozess von Axel selbst
Dieses Beispiel, das im Zusammenhang mit Destructuring und Iterables genannt wird:
let arr = ['a', 'b', 'c'];
for (let [k,v] of arr.entries()) {
console.log(`key = ${k}, value = ${v}`);
}
// Output:
// key = 0, value = a
// key = 1, value = b
// key = 2, value = c
Außerdem sprechen wir über das kommende ECMAScript 7, JavaScript Module, und warum die umstrittensten Sachen wie Klassen gleichzeitig zu den wichtigsten fürs JavaScript Ökosystem gehören. Für weitere Informationen empfehlen wir das ECMAScript 6 Buch sowie das Doctor’s Diary.
[00:39:54] RollupJS
RollupJS ist der neueste Schrei im Modul-Bundling. Hat aber auch einen Grund. Mit ECMAScript 6 Modulen und Technologien wie Tree Shaking kann er etwas, dass bisherige Modulbundler sträflich vernachlässigten: Nur das ins Bundle schmeissen, das man auch wirklich braucht. Der Doktor klärt auf. Auch hier und hier.
[01:03:20] Keine Schaunotizen
CDNs
Rodney kennt eine Menge CDNs, wo JavaScript Developer ihre Bibliotheken gut verteilen können:
RawGit (alles von GitHub)
BowerCDN (alles von Bower)
BrowserifyCDN (alles von NPM)
cdnjs
jsDelivr
TL:DR; Man Pages
Wenn Unix manuals zu geschwätzig sind, kommt man mit tldr schnell zu den Beispielen.
Do I Use
Node Tool, dass dir sagt ob du CSS Features verwendest, die deine zu unterstützenden Browser vielleicht gar nicht können.
Chrome CPU Throttling
Seit neuestem kann man in den Chrome (Canary) Dev Tools auch die CPU Leistung drosseln.
Exploring ES6
Das ECMAScript 6 Buch des Doktors.
Setting up ES6
Ein Addon zum vorigen Buch, das sich ums Tool-Setup kümmert.
1 hr 12 min
December 31, 2015Revision 247: Reaktive funktionale Programmierung
Zum Jahresabschluss holten wir uns mal wieder den Kahlil ins Haus und besprachen mit ihm das Konzept der reaktiven funktionalen Programmierung anhand der JavaScript-Frameworks cycle.js, Rx und Bacon.js.
Schaunotizen
[00:00:13] Reaktive funktionale Programmierung
Reactive Extensions
Cycle.js
Bacon.js
Observables: Collections auf einer Zeitleiste zur Datentransformation
Kahlil: „Es ist wie Rohre legen“
Talk zu Cycle: What if the user was a function?
Slides zu Bacon: Functional Reactive Programming and Bacon.js
MVI-Pattern, Komponenten, React
Grundlagen funktionaler Programmierung
[01:14:37] Keine Schaunotizen
postcss-bem-linter
A BEM linter for postcss
stylelint
A mighty, modern CSS linter that helps you enforce consistent conventions and avoid errors in your stylesheets.
Descriptive
Podcast zum Thema „Programmer Origin Stories“
Reactive
„A podcast in which we merge, filter, scan and map streams of thoughts and talk about software engineering, culture, and technology.“
Diskutiert die Folge mit uns in unserem Community-Slack: https://draft.community/
1 hr 21 min
December 31, 2015 Revision 247: Reaktive funktionale Programmierung
Zum Jahresabschluss holten wir uns mal wieder den Kahlil ins Haus und besprachen mit ihm das Konzept der reaktiven funktionalen Programmierung anhand der JavaScript-Frameworks cycle.js, Rx und Bacon.js.
Schaunotizen
[00:00:13] Reaktive funktionale Programmierung
Reactive Extensions
Cycle.js
Bacon.js
Observables: Collections auf einer Zeitleiste zur Datentransformation
Kahlil: „Es ist wie Rohre legen“
Talk zu Cycle: What if the user was a function?
Slides zu Bacon: Functional Reactive Programming and Bacon.js
MVI-Pattern, Komponenten, React
Grundlagen funktionaler Programmierung
[01:14:37] Keine Schaunotizen
postcss-bem-linter
A BEM linter for postcss
stylelint
A mighty, modern CSS linter that helps you enforce consistent conventions and avoid errors in your stylesheets.
Descriptive
Podcast zum Thema „Programmer Origin Stories“
Reactive
„A podcast in which we merge, filter, scan and map streams of thoughts and talk about software engineering, culture, and technology.“
1 hr 21 min