Christian Schaefer's repositories
CSS-Filters-Polyfill
This polyfill takes the official CSS filters syntax and translates it to the different equivalent techniques that the browsers know for those effects
dom-treemap-devtools-extension
A Chrome Devtools extension that helps you explore the distribution of DOM nodes in the document tree.
HTTP-headers
Every call we send to and receive from a web server is accompanied by more or less metadata, also known as the HTTP headers. Usually, those headers stay hidden in the shadows and we barely notice them - and we underestimate their powers. But ignoring them is a mistake! There is a lot happening around them lately. During The last couple of years a lot of new and powerful headers have emerged which, when applied correctly, help us harden our web applications against attacks and make our sites load a lot faster. That's why in this talk, I'm gonna give you the modern take on how to make the web more secure & fast.
async-document.write
Patches document.write to execute in a non-blocking way.
native-browser-apis
In this talk, I will give you an overview on how far native browser APIs have matured, thus freeing our sites from the grips of jQuery, lodash and other helper libraries. We will look at working more elegantly with arrays and objects in JavaScript, at modern DOM traversal and manipulation possibilities, at event delegation, at native smooth scrolling, look at ways to build carousels without library, we will explore built-in tools for image and font lazy loading, and we will bury DOMContentLoaded forever.
grunt-compile-revealjs
Compiles reveal.js slide decks from a JSON configuration and HTML partials
making-of-rp-online
Nachrichtenseiten im Jahre 2020: Making of RP ONLINE
grunt-spreadsheet-to-json
Takes a Google Spreadsheet with translations and generates multiple JSON files from the columns.
HTTP-2
20 years have passed since the IETF introduced HTTP/1.1. At the time web pages were still designed with tables and font tags and they had hardly more than four images per page in total. HTTP/1.1 was perfectly suited to this application scenario. For today's projects, however, HTTP/1.1 is a massive bottleneck. To compensate for its conceptual disadvantages, we developed build processes in which we bundle resources via concatenation, inlining or spriting. In addition, we rely on concepts such as domain sharing and cookieless domains. The good news is: HTTP/2 has arrived and puts an end to the disadvantages of its predecessor. And it is supported by all modern browsers. But it's not enough to just flip a switch. We need to rethink and throw established processes and concepts overboard if we are to get the most out of HTTP/2.
imagery-on-the-web
Using images on a website is pretty straightforward, right? It's using an <img> element or a CSS background and then have them display a JPG, PNG or SVG. And that's it. Or is there more to it than that? Well, yes, there is. And it's a truckload full of possibilities.
prototyping-for-performance
Performance-Experimente mit Chrome Devtools und CloudFlare Workers
schepp.dev
My personal site
a-property-to-unlock-the-world
A Talk on why CSS Houdini is dead, but `@property` is not.
css-next
After Grid and Flexbox CSS seems to have lost most of its dynamic. The most urgent layout problems seem to be solved and all eyes turn to JavaScript, because that's where all the exciting things seem to happen at the moment. But is CSS really "feature complete"? And does this development standstill really exist? To find that out, we first search for recently implemented CSS properties. Maybe we will find some after all? Then we take a look into the W3C's CSS crystal ball to see if there are some exciting things planned for the future.
grunt-sass-recursive-import
Recursively includes SASS Partials in all Subdirectories
HTML5-WPO-Slides
Slidedeck for the HTML5 Days 2014 in Munich
webtechnologie-gluecksrad
Das Working Draft Webtechnologie Glücksrad
webzuerich-may-2020
You think you are a web veteran and so by now you know everything about using images on the web? Well, I wouldn't be too sure about that. My talk will feature a potpourri of very unusual techniques, centered around the use of images on the web. Some of them are stone old, some are bleeding edge, some are useful, and some are completly useless. And I bet, you don't even know half of them.
11ty-website
Documentation site for the Eleventy static site generator.
currentScript-polyfill
An exceptionally slim polyfill for document.currentScript in IE9+
fronteers-jam-session-2019
You think you are a web veteran and so by now you know everything about using images on the web? Well, I wouldn't be too sure about that. My talk will feature a potpourri of very unusual techniques, centered around the use of images on the web. Some of them are stone old, some are bleeding edge, some are useful, and some are completly useless. And I bet, you don't even know half of them.
grunt-angular-template-inline-js
A grunt task runner for angular-template-inline-js
IntersectionObserver
API Sketch for Intersection Observers
nca-todo-app
Never Code Alone Event | Vue.js Todo Demo App
twig.js
JS implementation of the Twig Templating Language
webwewant.fyi
If you build websites, you inevitably run into problems. Maybe there’s no way to achieve an aspect of your design using CSS. Or maybe there’s a device feature you really wish you could tap into using JavaScript. Or perhaps the in-browser DevTools don’t give you a key insight you need to do your job. We want to hear about it!