Düsseldorf, Germany

Christian Schaefer

Elite
@Schepp

Nick: Schepp | Into Front-End & WebPerf | Co-Host Working Draft podcast | Co-Organizer Fronteers Conf, CSS Café & Webworker NRW

box-sizing-polyfill. A CSS box-sizing: border-box polyfill for IE 6/7

1.2k

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

750

CSS-JS-Booster. An easy to use stand-alone PHP-Library (but at the same time also a Wordpress plugin) that combines, optimizes, dataURI-fies, re-splits, compresses and caches your CSS and JS for quicker loading times.

301

dom-treemap-devtools-extension. A Chrome Devtools extension that helps you explore the distribution of DOM nodes in the document tree.

76

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.

29

CSS-Parser. A nice litte css parser written in php

19

async-document.write. Patches document.write to execute in a non-blocking way.

17

CSS-Prefix-Spawner. Tired of having to repeat all vendor prefixes over and over again just for getting your cross-browser dosis of CSS 3 eyecandy? Bother no more, my friend! Paste your single-vendor CSS or point to the file and we will automatically add the rest.

12

connection-type-checker. Utility that tries to figure out if you are on cellular or broadband

11

SASS-Mixins.

9

Chroma-Corners. “Chroma Corners” is the name of a new technique to create rounded corners in IE 6 – 8. It uses IE’s chroma-filter as a tool to mask away corner areas, which are created as a graphic and which are filled with a solid color. It is and behaves like standard HTML + CSS as opposed to the newer VML-based approches. It gives you more freeness and needs less photoshopping work than older background image based techniques for rounded corners like “Mountain Top” or “Sliding Doors”.

5

IMG-2-TABLE. PHP-Script that converts GIF, PNG and JPG images to a TABLE-markup reproducing the image. Good for embedding images non-blockable inside HTML-emails. The lower the color-count the better for resulting code-size!

4

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.

4

making-of-rp-online. Nachrichtenseiten im Jahre 2020: Making of RP ONLINE

3

grunt-compile-revealjs. Compiles reveal.js slide decks from a JSON configuration and HTML partials

3

crx-submit-to-workingdraft-trello. Chrome extension for submitting links to our podcast's board on Trello

3

HTML5-Canvas-Workshop. JavaScript

3

css-only-theme-switcher. Presentation: Turning CSS Carousels into a Theme Switcher

3

grunt-spreadsheet-to-json. Takes a Google Spreadsheet with translations and generates multiple JSON files from the columns.

2

prototyping-for-performance. Performance-Experimente mit Chrome Devtools und CloudFlare Workers

2

schepp.dev. My personal site

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.

2

Turbine-Extras. Additional files extending the capabilities of Turbine

2

Turbine. A collection of PHP-powered tools that are designed to decrease css devolopment time and web developer headache.

2

CSS-JS-Booster-Website. PHP

2

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.

2

sustainable-web-design. Presentation: Our climate is stumbling from one negative record to another. There's a lot of talk about coal-fired power plants and fossil fuels as accelerants of climate collapse. But what role do we web people play? Are we part of the problem? And if so, how can we become part of the solution?

1

webtechnologie-gluecksrad. Das Working Draft Webtechnologie Glücksrad

1

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.

1

CSS1K. A demonstration of what can be accomplished with only 1 K of CSS.

1

HTML5-WPO-Slides. Slidedeck for the HTML5 Days 2014 in Munich

1

grunt-sass-recursive-import. Recursively includes SASS Partials in all Subdirectories

1

Turbine-Browser. Turbine's browser sniffer (http://github.com/SirPepe/Turbine)

1

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.

1

Turbine-Website. Website for Turbine (http://github.com/SirPepe/Turbine)

1

a-property-to-unlock-the-world. A Talk on why CSS Houdini is dead, but `@property` is not.

1

wwnrw. Website of the Webworkers NRW meetup

1
37
Apply