Contains videos from our past conferences, meetups and jam sessions. For and by front-end developers.
Deze presentatie is in het Engels. In de beta-website van Schiphol wordt gebruik gemaakt van een set eigen componenten, die samenwerken met een pub/sub-systeem. Tamara vertelt over de ontwikkeling en het gebruik van deze componenten. More info at: https://fronteers.nl/bijeenkomsten/2016/schiphol
More info at: https://fronteers.nl/bijeenkomsten/2016/mirabeau
More info at: https://fronteers.nl/bijeenkomsten/2016/mirabeau
Occasionally, the stakeholders at your client need some convincing to have you go the extra mile for performance. That means making a business case for web performance optimization. In his closing keynote, Kristian Sköld will help you do this using data-based analysis and real-life examples of his large-scale clients. More info at: https://fronteers.nl/congres/2016-spring/sessions/closing-keynote-kristian-skoeld
Interactive panel discussion with Yan Zhu, Tobias Baldauf and Mathias Bynens on technical performance. More info at: https://fronteers.nl/congres/2016-spring/sessions/interactive-panel-discussion-technical-performance
In security-sensitive situations, performance can actually be a bug rather than a feature. This presentation covers timing attacks on the web, and demonstrates how modern performance-related web APIs can sometimes have a negative security impact. More info at: https://fronteers.nl/congres/2016-spring/sessions/front-end-performance-the-dark-side-by-mathias-bynens
Images form 64% of all website data & have a high correlation to page load time. Optimizing image delivery through compression alone is a daunting task. Using HTTP2's superpowers, we can optimize images to ship faster, increasing the perceived performance and initiating users' emotional responses to visuals earlier. HTTP2-powered image delivery leads to lower bounce rates and higher conversions. More info at: https://fronteers.nl/congres/2016-spring/sessions/save-the-day-with-http2-image-loading-by-tobias-baldauf
Everyone in 2016 knows that websites should use HTTPS. However, there is a common misconception that TLS and other security measures slow down both web developers and page load times. This talk will show you some easy tricks to make your site more secure without sacrificing performance. More info at: https://fronteers.nl/congres/2016-spring/sessions/towards-faster-safer-websites-by-yan-zhu
Interactive panel discussion with Marcy Sutton, Karl Groves and Estelle Weyl on accessible performance. More info at: https://fronteers.nl/congres/2016-spring/sessions/interactive-panel-discussion-accessible-performance
Responsive Web Design (RWD) is the solution for putting our apps on mobile devices. Or is it? Bloated web applications that simply shrink in width are not usable. Squishy design is not the only, or even the main, solution for improved mobile web user experience. Other than responsive design, how can we improve performance so our mobile web applications, responsive or not, are usable and accessible no matter how a user chooses to access it. More info at: https://fronteers.nl/congres/2016-spring/sessions/rwd-is-not-a-panacea-by-estelle-weyl
There are scores of concerns, both back-end and front-end, when considering performance. When it comes to accessibility, user performance is also a major concern and extends beyond things like perceived time. While perceived time is very important for UX, accessible user experience intersects performance in that it requires allowing the user to answer one core question as they work with the interface: "What is this thing, and what does it do". In this talk we'll talk about the intersections of UX, performance, and accessibility and how each contribute to an accessible user experience. More info at: https://fronteers.nl/congres/2016-spring/sessions/to-hell-with-performance-by-karl-groves
By studying the limitations of browsers with assistive technologies and establishing developer best practices, we can we make faster, more accessible experiences for our users. We'll frame Web Performance with an Accessibility lens, looking at progressive enhancement in detail with server- and client-rendered apps built with Angular 2, React or Ember FastBoot; always remembering our friend, static HTML. More info at: https://fronteers.nl/congres/2016-spring/sessions/accessibility-and-performance-by-marcy-sutton
Interactive panel discussion with Tobias Ahlin, Paul Bakaus and Bram Stein on visual performance. More info at: https://fronteers.nl/congres/2016-spring/sessions/interactive-panel-discussion-visual-performance
Web fonts are great. They are also be really bad for performance because they block rendering. You may have experienced this on a slow cellular network. Staring at a blank page is no fun, especially when content has already loaded. More info at: https://fronteers.nl/congres/2016-spring/sessions/web-fonts-performance-by-bram-stein
If you could take a 50% hit in real world performance and get a site that feels 50% faster, would you? Nobody cares how fast your site is. All your users care about is how fast your site feels. Going beyond the perceived perf theory, Paul is bringing a bunch of demos of things that employ clever tricks and psychology to turn things that should be slow into things that feel incredibly fast. More info at: https://fronteers.nl/congres/2016-spring/sessions/the-illusion-of-speed-by-paul-bakaus
How do we animate smoothly without laptop fans going haywire all around the world? It’s through animation that we make sense of the world: doors swing open, cars drive to their destinations, lips curl into smiles. Even the things that feel instantaneous, like lightning striking, or dropping a phone on your face while browsing in bed, happen over time, and it’s through that motion that we understand how objects relate and function; if they are light or heavy, rigid or loose, connected or separate, sticky or slippery. More info at: https://fronteers.nl/congres/2016-spring/sessions/animation-and-perceived-performance-by-tobias-ahlin
More info at: https://fronteers.nl/bijeenkomsten/2016/ida-mediafoundry
Web development is in a state of confusion. We feel we are not innovating enough, we are let down by browsers and OSes and we try to fill all these holes with home made remedies. It's time to look at what we have, what we lost and what is a waste of our time. More info at: https://fronteers.nl/congres/2015/sessions/christian-heilmann-of-gaps-fillers-and-empty-spaces
Pretentious title aside, Remy will share how he approaches debugging, techniques that have become muscle memory, old tired and tested methods and (hopefully) show off a neat trick or two that can be achieved with today's state of the art debuggers. More info at: https://fronteers.nl/congres/2015/sessions/the-art-of-debugging-remy-sharp
Put your worries about browser support to one side for a little while as I introduce you to the newest specifications used for layout. We’ll then take a look at realistic ways in which you can start to implement some of the shiny goodness today. More info at: https://fronteers.nl/congres/2015/sessions/but-what-about-old-browsers-rachel-andrew
In this talk we'll discuss how Web Audio can greatly enhance your app performance and how it will enable you to build sophisticated and efficient tools with very little effort. We'll also cover debugging and interacting with other web APIs. More info at: https://fronteers.nl/congres/2015/sessions/hands-on-web-audio-soledad-penades
Nowadays, our built environment is largely made out of software. Developers directly influence the behaviour of their users through what the interface allows people to do with their software. A perfect interface isn't a solution for all software problems, but we do know that even the best algorithms are useless if they are not made accessible through an attractive and intuitive interface. This is essential when creating technology that is meant to protect our freedoms. More info at: https://fronteers.nl/congres/2015/sessions/freedom-can-be-designed-rejo-zenger
In this talk we'll explore what open data is (and what it isn't), and why we should care about it. We'll look at how you can introduce it into your projects with regards to practical publication and consumption, and discuss some useful tools and reference points. More info at: https://fronteers.nl/congres/2015/sessions/an-introduction-to-open-data-sally-jenkinson
How do you create an efficient workflow that helps you build better and faster websites or web apps? What are the tools you should be using? How do they all fit together? More info at: https://fronteers.nl/congres/2015/sessions/modern-workflow-tooling-for-front-end-developers-wes-bos
This talk will explore how we can break through some of those limits with the use of a new breed of hosted tools and services. We’ll look at practical examples of how a static site generator can help deliver a modern web development workflow, support a living styleguide, and also pack the kind of dynamic punch that you’d only think possible from bigger application stacks. More info at: https://fronteers.nl/congres/2015/sessions/static-sites-go-all-hollywood-phil-hawksworth
Just because it requires JavaScript, doesn't make it wrong, but we often use JavaScript to engineer-away the parts of the web that are already better than native. Let's take a look at some real-world JavaScript-heavy applications, and how they can regain the performance of the web without losing features. Then, let's tackle the area progressive enhancement has largely ignored: Connectivity. More info at: https://fronteers.nl/congres/2015/sessions/modern-progressive-enhancement-jake-archibald
"What is the business case for accessibility?" will examine the various business cases for making websites accessible. It will present their strengths and weaknesses and conclude with some advice for getting accessibility into the things you're building. More info at: https://fronteers.nl/congres/2015/sessions/what-is-the-business-case-for-accessibility-alice-bartlett
After interviewing a dozen people with Brad Frost for their podcast on Style Guides for the web, Anna has collated all their findings for this talk on the different kinds that are out there, how they're built, what works (and what doesn't), and what makes them such a useful tool. More info at: https://fronteers.nl/congres/2015/sessions/front-end-style-guides-anna-debenham
Let's be honest: A JavaScript MPEG1 decoder sounds like a rather silly idea, but there are real world use cases where jsmpeg shines. In this talk I want to show some of the things that you can do with jsmpeg that you can't do with the HTML5 Element. I will also talk about how WebGL was used to speed up the decoding and discuss other tricks that improved performance. More info at: https://fronteers.nl/congres/2015/sessions/jsmpeg-by-dominic-szablewski
Why does one set up a digital agency in the middle of a recession? Because one thinks one can do better. As it turns out, 'doing better' – marrying great design and progressive development whilst keeping clients happy and budgets lean – is a tightrope walk between delivering uninspired work and going out of business. Join us as we review what we've learned over the past four years. There will be tears! There will be triumph! There will be monkeys! More info at: https://fronteers.nl/congres/2015/sessions/walking-the-tightrope-between-mediocrity-and-bankruptcy-primate
Sass has revolutionized how we write our stylesheets, but you may have found yourself frustrated by waiting for stylesheets to compile. In this talk Sass core developer, Chris Eppstein, will give you ways to speed up your stylesheets and get your app's build running lighting fast. Learn how to use libsass in your javascript asset pipeline, how to use Eyeglass to package and consume sass modules with NPM, and how to write your own custom Sass functions in Javascript. More info at: https://fronteers.nl/congres/2015/sessions/lightning-fast-sass-chris-eppstein
Do you spend a lot of time building products and experiences just to have them be poorly implemented or rejected by various factions in your organization? Sometimes the hardest part of your job is getting your whole organization to fall in line and holistically develop and implement a consistent experience. Fighting about control over web pages, mobile interfaces, and every other aspect of an organization’s online presence can leave one frustrated and fatigued. More info at: https://fronteers.nl/congres/2015/sessions/digital-governance-lisa-welchman
Responsive Design allows us to create flexible user interfaces that support the widest possible audience with a single front-end codebase. But in embracing the ever-increasing contexts in which our sites are used, performance and accessibility must remain our highest priorities; we must continually question each code addition, and improve our delivery and application techniques to ensure they’re best serving users’ needs. More info at: https://fronteers.nl/congres/2015/sessions/delivering-responsibly-scott-jehl
00:19–00:29 How to learn about web accessibility without going crazy by Eric Eggert In this talk, the audience will learn how to crack open the accessibility information that is out there and what tools and help is provided so they can understand the opportunities that an accessible web site creates. It will also have a brief look into how accessibility can be assessed and communicated to the responsible parties. More info at: https://fronteers.nl/congres/2015/jam-session
00:07 – 00:17 Styling books by Oleg Mokhov What if you need just read a book in browser? This talk is about styling books and making them readable and convenient to read. CSS Columns, flexible images, annotations and something even more. More info at: https://fronteers.nl/congres/2015/jam-session
23:55 – 00:05 Declarative templates for HTML by Vladimir Grinenko We all love declarativeness of CSS. Why not to use same approach for HTML templates as well? Vladimir will share the experience they've got at Yandex. More info at: https://fronteers.nl/congres/2015/jam-session
23:43 – 23:53 7 Things You Always Wanted To Know About A11Y by Jules Ernst Or 6 or 8. Last year I've been testing lots of sites. On the subject of accessibility often the same mistakes are made. More info at: https://fronteers.nl/congres/2015/jam-session
23:18 – 23:28 Designing with “real” data by Andreas Dantz Break your designs early and save a lot of time and money. It doesn't matter if you design in the browser or mock things up in Sketch or Photoshop. A few examples and methodologies from past projects. More info at: https://fronteers.nl/congres/2015/jam-session
23:06 – 23:16 A eulogy for Internet Explorer, 1995 — 2015 by Niels Leenheer This summer Microsoft released Windows 10. For us web developers this is important, because for the first time since Windows 95 SR1, Internet Explorer is no longer the default browser.Its my opinion now would be an appropriate moment to say goodbye to Internet Explorer. More info at: https://fronteers.nl/congres/2015/jam-session
22:54 – 23:04 The art of selling tickets by Jan van Hellemond This year, for the first time ever, Fronteers used a custom built ticketshop to sell tickets to the conference and workshops. Although there are many options available for selling tickets online without having to build something yourself, most are... not very good. And even the good ones tend to have a quirk or two and can be quite expensive. I would like to give a little insight into building a robust and resilient webshop that can handle a generous peak load without breaking itself or the bank. More info at: https://fronteers.nl/congres/2015/jam-session
22:42 – 22:52 Smart eCommerce Design Patterns by Vitaly Friedman In the end, it's all about checkouts and conversion rates, isn't it? In this short talk, we'll look at some practical techniques and strategies on improving conversion with better form design — using modern technologies and innovative examples. More info at: https://fronteers.nl/congres/2015/jam-session
22:17 – 22:27 Make Them Click by Roy Tomeij Whether you want it or not, you're the constant victim of neuro-marketing. By tapping into your "reptile brain", you are unconsciously made to click, like and buy. Let's take a look at some proven techniques to trick your mind (on and off line). You'll learn how to see others' influence on you, and maybe to exert some influence of your own. More info at: https://fronteers.nl/congres/2015/jam-session
22:05 – 22:15 CSS is like sex by Bart Oleszczyk This talk is not about sex, but in fact about cooking eggs (and CSS of course). More info at: https://fronteers.nl/congres/2015/jam-session
Turning their oscillating online outing into a decidedly destructive down-to-earth diatribe - for one night only - in the blue corner: it's Peter-Paul "The Wall" Koch, QuirksMode's quaestor, and in the red corner, it's Young Jaffa, the boy bashful, the Web's wondrous wizard: Jake "The Cake" Archibald. Presented and moderated like no other, in the Amsterdam 2015 Fronteers Jam Session Arena, by that inimitable imperator, Opera's own Ozymandias, Fronteers's MC, Mr: Bruce "The Law" Lawson. More info at: https://fronteers.nl/congres/2015/jam-session
21:18 – 21:28 Fancy Input Elements with Web Components by Kristofer Walters I start with an input[type=range] element and step by step add web components stuff to it. The result is a star rating widget, as seen on amazon et al. More info at: https://fronteers.nl/congres/2015/jam-session
21:06 – 21:16 Rebuild your own React by Sergey Berezhnoy https://github.com/dfilatov/vidom is a React-inspired library for building web interfaces. In his talk Sergey will talk about the basic ideas behind it, like speed, lightweight ans simplicity. Furthermore this talk is aboud the process if reassembling things as a method to understand them deeply. More info at: https://fronteers.nl/congres/2015/jam-session
20:54 – 21:04 Building React Components Library by Robert Haritonov React provides a great foundation for building and implementing reusable components, that whole team (and community) could greatly benefit from. But to make the code actually reusable, it should be properly presented and documented. Robert will guide you through the key patterns of building React components library with proper navigation, rendered examples sandbox and API description. More info at: https://fronteers.nl/congres/2015/jam-session
20:42 – 20:52 Front-end Frameworks Extravaganza by Jeroen Heijmans Frameworks come at a cost, but can help immensely in development, especially with line of business applications many of us write. Knowing which to pick, or even which ones are there can be a challenge. I'll take a few minutes to present a helpful (but opinionated) overview, and add to that the intriguing promise of also showcasing them without going into overtime... More info at: https://fronteers.nl/congres/2015/jam-session
20:35 – 20:40 A song about front-end by Paul Verbeek A song honoring the broad technical skillset a front-end developer has to deal with. Might be a bit off-key and off the beat. More info at: https://fronteers.nl/congres/2015/jam-session
We’ve been able to use JavaScript in the browser for quite some time now and even on the server it’s nothing new, but what if we could use JavaScript to control hardware? With the rise of “the Internet of Things” and the simplicity of the Arduino platform this is no longer just a dream it offers us a vast amount of possibilities. In this session we’re going to look at just the tip of the iceberg of these options (no worries, we will not create any self-aware machinery). More info at: https://fronteers.nl/bijeenkomsten/2015/insided
Mauro has been working on a tool to build a icon font sets from svg files saved in a dropbox folder. This tool will automatically create the need font files, with css and upload them to our amazon servers. Creating a real nice workflow for keeping our icons up to date. More info at: https://fronteers.nl/bijeenkomsten/2015/insided