Video Recording and Production done by JSConf
We present a functional take on front-end data-binding. MVC, MVP, MVVM, just the V – there are many useful architectures for data binding when data changes in discrete chunks. For data that changes continuously in time (animations, gesture controlled UI, responsive layout, etc), these are not the best tools. By treating continuously changing layout data in a functional way, and updating discrete changes to a model’s data in an MV* way, we can split the data-binding problem into two cleanly separated problems. In so doing we make all our tools better at what they do best.
We have ethical responsibilities when coding. We’re able to extract remarkably precise intuitions about an individual. But do we have a right to know what they didn’t consent to share, even when they willingly shared the data that leads us there? A major retailer’s data-driven marketing accidentally revealed to a teen’s family that she was pregnant. Eek.
What are our obligations to people who did not expect themselves to be so intimately known without sharing directly? How do we mitigate against unintended outcomes? For instance, an activity tracker carelessly revealed users’ sexual activity data to search engines. A social network’s algorithm accidentally triggered painful memories for grieving families who’d recently experienced death of their child and other loved ones.
We design software for humans. Balancing human needs and business specs can be tough. It’s crucial that we learn how to build in systematic empathy.
This talk will focus on the new generation of APIs which make the web a more capable platform for applications. Push Notifications, Offline Storage with Service Workers, and responsive UIs built in Web Components. These are the building blocks of the future. We will also look at the kinds of sites which excel as mobile web apps (backed with actual data!), and make the case for why you should be investing more in your mobile web experience.
2015 is when WebRTC broke through. Barely a standard it already has its own conferences, yet is mostly known for it’s ability to do video calling. It is time the web developer community becomes aware of all the powers of WebRTC and a browser-to-browser web that can be faster, more resilient and safer. This talk wants to open minds, through the power of code and demos, showing incredibly useful, fun and even ridiculous use-cases (from WebTorrent to Karaoke to Selfies) cut through the complexity of WebRTC and inspire what could become the democratisation of the web
If extensive libraries and even the tiniest module followed SemVer strictly, dependency hell would be a thing of the past … but humans weren’t made to follow rules.
Modern web developers have become heavily dependent on abstractions like jade, sass or ES6. These are powerful tools, but to themselves require new abstractions, wrappers and runners. The rate at which new tools, workflows and even languages are appearing is staggering. Each iteration adds more complexity and less interoperability.
So how do we expect newcomers to be able to enter our field when we can hardly keep up ourself?
This will be an exploration of our tool chains with a focus on transpilers. The mission: To identify moving parts, recompose and simplify for the good of the current and future generation of developers.
Remember the old joke about how the Java slogan “write once, run everywhere” was more like “write once, debug everywhere”? Good one. Actually, many people say this about the Web, too. In fact, it would be more accurate in our case to state it as “write once, debug everywhere, each time with different tools”. But does it have to be that way?
A new Firefox feature called Valence allows you to debug your web app in any target environment: Firefox, Chrome, iOS, Android, you name it. Does it actually work? How does it work? Can we expect more from it? How can other browsers use it? In this talk we will find the answers to these questions and discuss the accuracy of the tentative slogan “write once, debug everywhere, from Firefox” (or lack thereof).
This is the story of a new browser with a complicated legacy. It’s a story about making new friends without alienating old acquaintances. Most of all, it’s a story about innovating without breaking the Web. This is the story of Microsoft Edge, the new browser in Windows 10, how it came to be, what separates it from Internet Explorer and what that means for web developers. It’s a tale of epic proportions with a happy ending that is really only the beginning.
We all take for granted that when we push enter in the browsers address bar, magic happens. The browser gets our HTML, that intern requests all the dependencies, insert magic, other things happen and then we have our site rendered. Simple, right, right…
Suddenly you’ll understand why people recommend you place script tags at the bottom of the document, inlining critical CSS & all sorts of other performance techniques.
We probably all know that diverse teams are effective teams. Teams with more gender diversity have been proven to be more creative, productive, innovative. Nevertheless, the technology industry, has been showing a recent and steady decline regarding women who find and pursue degrees in what should be a growing pool of opportunity. In this talk we’ll examine the reasons behind the gendergap in IT by going on a small trip and we’ll figure out what we can do to make our community better in only a couple days!
What is common for Walt Disney World, airports and magicians? All of these are distorting user’s perception to build illusions that make us feel good even though we don’t notice them so easily. Those are time illusions. Developers, as magicians, can use the same techniques to distort users’ perception of time to deliver fast and competitive products. The talk is about psychology, perception, time and, of course, illusions.
In the recent time Web development community had a big discussion on “DOM is slow” topic. This thesis is truthful. DOM is a quite complex model which starts a ripple of events or chain reaction over document on every modification. HTML GL solves “the slow DOM problem” by creating WebGL representations of DOM elements and hiding actual DOM after. This speeds up HTML/CSS animations and transformations by using 3D hardware acceleration and allows to apply OpenGL effects as modern 3D games have.
In this talk:
The “Slow DOM problem”;
DOM optimization vs alternative rendering approaches(React-canvas, Netflix methodology);
Seeking for an ideal solution;
Rendering content via WebGL using HTML GL
Where to go further?
A lot of us are engineers at companies that don’t enshrine technology as their core product, or that employ significantly more non-technical than technical people. Others of us work completely alone as freelancers. If you’re in that position, how do you create a place for technological transformation in the organization, or communicate with non-technical clients?
I’ll cover how to - evaluate what your project needs - maintain your productivity - create understanding of technical issues - keep learning without anyone around to teach you new stuff.
The difference of JSVMs and performance implications
The state of WebIDL and why it matters
Types and optimizing compilers: an AOT love story
Technology is always just a means to an end. That’s why we’ll also look at self-optimizing display lists, WebGL and the WebAudio API in real-world apps.
Burnout saps the joy from creating and leaves the world in shades of grey. What do you do when you realise your work is meaningless and you dread going in every day? As an engineer, you can analyse the system, determine what is missing, and inject some much needed color.
A few months ago I was invited to give a workshop at Women’s International Leadership Conference on Introduction to Programming. That was an amazing experience that taught me incredible things and motivated me to open source all the steps. Some of the topics I’ll cover on this talk are:
What is feasible in a short length workshop
How programming workshops empower and inspire learners
How this experience contributed to my own learning, as well as personal and professional growth
The materials to reproduce this workshop
Time zones – the undoing of many developers’ sense of sanity. Get them right and most likely your users won’t even notice. Get them wrong and you can end up increasing racial tensions in the Middle East. As we embed ourselves further into this Brave New World of JS Everywhere, let us not forget the basic lessons from before JS existed. This talk will explain the oddities, pitfalls, and ever-changing nature of time zones, so that you may learn from my mistakes (I wasn’t kidding about the Middle East bit).
In this talk I will try to show you what language is trying to tell us for all these years, where is real path to enlightenment or at least we could have fun and look at things we know (or pretending to ;) from unorthodox point of view. ;)
In “The Hitchhiker’s Guide to the Galaxy” the Babel fish is an animal, which “if you stick one in your ear, you can instantly understand anything said to you in any form of language”. In this talk I’ll show you how easy it is to write a web app that does exactly that. I’ll also discuss some of the current Web Speech API limitations that hopefully will be removed in the near future to make the web even more powerful platform for real-time communication. And you won’t have to stick anything into your ear!
In an industry that is so focused frameworks & tooling, we tend to lose sight of the people behind the products and how we work with them. I’ve found empathy to be a powerful resource while collaborating with teams inside companies and across the open source community. By breaking down The Other Side of Empathy, I will demonstrate how applying its principles to your development process will benefit the community and the products they create.
Web-based WYSIWYG editors are notorious for spitting out a distasteful HTML soup. In this talk I’ll show how I implemented an editor that, instead of trying to filter and clean this soup, takes control away from the browser’s contentEditable implementation, and reinterpret user actions as operations on our own semantic document model (i.e. not HTML). The result is a WYSIWYM (what you see is what you mean) editor, more predictable than classic WYSIWYG, and just as user friendly.
How would your message change if your email client told you your phrasing is likely to be perceived as negative? What would you cook if you could explore ingredient and culinary style pairings you’ve never encountered? How could your research improve if answers came with confidence levels and supporting evidence you can explore?
Welcome to the world of Cognitive Computing, the next wave of computing technology bridging the gap between computers and humans. While these possibilities may seem far off, you can build all of these today! Let’s explore.
Web app technical diagrams fall into the trap of over simplifying complexity. And so diagrams which are meant to represent 1,000s or even 10,000s of hours of the large scale multidisciplinary construction effort that is a web app project is reduced to sticks-and-clouds architecture drawings, coarse wire frames and/or detailed UI mockups or screenshots.
What’s missing from these representations ? Usually a lot - like code volume, 3rd party dependencies, environments, delivery processes and so much more. This talk presents a new vision of web app technology diagrams using the structural engineering drawing technique of isometric projections to provide much better perspective of the multi dimensional nature of web app programming projects.
A taste of this new style of diagraming of web apps can be seen, today, at the speaker’s site stackynotes.com but diagrams with much more depth and breadth will be explored in the actual conference talk.
In the recent years high-level frameworks have become the de facto standard for writing client-side webapp code. Angular, Polymer, or Dart all provide extremely useful abstractions for building applications, but also indirectly expose rough edges of the web platform which often lead to vulnerabilities (e.g. XSS).
In my talk I will provide a security engineer’s perspective on some of the common pitfalls which tend to affect code written using such frameworks based on real examples of bugs in Google apps. I will also explain why security reviews of such apps are often more difficult to conduct than those of “bare metal” JS code, what could be done to fix this, and why framework designers should care about it.
Every time we solve an everyday programming problem we learn from its solution. When we come across a similar problem later on, we think “aha! I’ve seen this before! I know how to solve it!”. Many of us are also familiar with design patterns, which aim to solve entire classes of problems.
There also exists, however, a different kind of pattern. But, as opposed to help you structure a whole compiler or application, these patterns love hiding in small things like methods or functions, or even binary operations. They whisper to you when you concatenate two strings or map over a list.
These abstractions have superpowers, too. They can separate the what from the when, or from the how. They can add together things other than numbers. They can control time. In this talk you will discover the amazing power of small abstractions. After, you’ll start hearing their whispers and seeing their breadcrumb trails. Only then you will be ready to let them unfold their full potential in your programs.
There was a time when data connections like WiFi and Bluetooth didn’t exist, yet people still managed to send information over long distances using clever encodings like Morse Code, sound waves and visual impulses.
What can we learn from that?
This talk looks at ways to use web platform capabilities, like the Web Audio API, Ambient Light Events and Touch Events, to revisit old data transmission techniques and apply them in new contexts. We’ll use demos to explore ultrasonic networking between air-gapped devices, indoor positioning without GPS and sending data through touch.
Finally, we’ll look at the privacy implications these unconventional networking capabilities bring.
Recursion, instantiate, lexical scope - where do these words come from?! If you’ve ever been in conversation with other developers and thought, “I think I know what they’re talking about, but I’m not sure…”, you’re not alone. Let’s delve into the weird and wonderful parlance that computer scientists and developers have created for themselves. Whether the words are borrowed or just plain made up, I’ll uncover how they made their way into the vocabulary of the modern programmer.
In this session, you’ll learn everything from etymology to history to broader definitions, all of which can help you understand what the heck that person’s rambling about. So, the next time you’re in conversation, you’ll be the one discussing dependency injection versus inversion of control with ease.
Imagine many teams distributed over the globe working on different services. Each team is small enough to be fed with two large pizzas. Got that? Welcome to AWS! This is what makes us successful, but it also brings its own challenges. One of them is ensuring accessibility, performance, and consistency across all our UIs. Because of this we chose to explore Web Components in the last year and I want to share what we have learned. I will go over the current state and support of all Web Components building blocks. It will get technical fast as I tell you why polyfills did not work for us. We continued to investigate the underlying technology and wrote our own library that I want to share with you. As no goal can be achieved by ‘only’ producing code, I will also explain what I did in addition.
Does it seem like everyone else knows more than you? Do you see people on stage or organizing events and think, “I could never do what they do”? Have you felt marginalized by the tech industry? Getting involved can be a daunting prospect, especially if you’re from a marginalized group. But there are a few decent and kind communities out there, and getting involved can be highly rewarding. It’s also a lot easier than you think!
In this talk, I will discuss how I got involved as a not straight male, how you can do it too, and how we can make our communities better and more welcoming for everyone.
It is long known that the quality and setting of the light in our environment influences our moods and minds in a near-infinite number of ways. Yet the lights in most homes and work places are still restricted to the ever present on-/and off-switches (and maybe some dimming).
Can we use these tricks to even control professional light-equipment on stage? You’ll see.
Can you use HTML5 technologies to build a web application which works offline? Without a reliable internet connection? Let’s say for two weeks?
That is what our client asked us to build. Their people will use the application on the road; reading documents, entering results and uploading pictures. And then they come home, connect to the internet and sync their results with their colleagues’.
After a local VanJS meetup, my friends and I were tossing around project ideas. Someone referenced a website that would procedurally generate terrible ideas for video games. “A tycoon game where you draw horses indefinitely”.
What a wonderful, terrible, awful idea for a game.
You’ll pay for the whole seat but you’ll only need the edge.
Moving up the ladder from forklift driver and general labourer, to front end developer, with a stint in manual testing, was a big challenge. However it’s exactly what I did, and I couldn’t have done it without following a few core principles.
Getting up the nerve to go to local usergroups, and conferences, and discovering a new found love of public speaking, was a huge leap from labouring. Similarly, I discovered contributing to open source wasn’t that big a deal, and some things certain projects did made it really easy! Also, learning about things like source control was super integral to being where I am today.