Forward JS 2
The sequel.
State of the Community
The community was born in the sprit of open-source. The spirit of generosity, collaboration, building better communities is inseparably intertwined with building a better self. Be a mentor, communicate compassionately. Community is a group responsibility. Let's own it.
"Open source was built on the premise of collaboration.” The spirit of generosity.
Art - R&D of humanity
As we build an interconnected world, we are building a relationship with physical objects.
"Art is R&D for humanity." http://t.co/7Z3VWOMYMR @superSGP #forwardjs
— Karen Rustad (@whoisaldeka) February 4, 2015
Technophobia
"What if objects were...loyal?"
GPU and Web UI Performance
Diego Ferreiro Val @diervo
Creating complex UI components such has always been a challenge on the web. You have to do mathematical calculations, trigger beautiful transitions, and manipulate the DOM (with its costly paints and reflows) in an orchestrated and performant fashion.
We will discuss the state of the art on web performance, with practical examples, we will learn techniques used for improving the performance of browser repaints and reflows, and showcase the latest tools for diagnosing bottlenecks and jank in the browser rendering engine.
Diego Ferreiro is a Principal UI and Web Performance engineer at Salesforce. He was previously at Yahoo!, working in the Search Platform Team migrating the architecture to use NodeJS and Mojito. Diego spend his days worrying about web performance, 60fps animations, and making the UI faster.
Browser Rendering 101
- DOM tree & CSS tree: constructed
- Recalculate Style: attaches the style rules
- Layout: calculate the changes, eg move 40px right, 3px down, add 40px of margin bottom.
Every time we touch the DOM, these events happen, we try to reduce the time these steps take.
The magic is in the GPU
Use operations that are cheap to compute.
ScrollerJS
- only touch the DOM when absolutely necessary
- reuse the same surfaces on the DOM
- isolate GPU layers to contraints
- defer execution as much as possible
"Use the power of the GPU wisely. Always try to find the right balance between perfomance and usability..."
Measuring performance
TODO: get the example.
Instrument your own framework!
#PerfMatters
What the... JavaScript?
Kyle Simpson - @getify
You've heard years of complaints about JavaScript and how many WTFs it has. It's certainly popular to be in the "I use JS but it's a crazy language" camp. But is it really riddled with bad design? There are definitely some legitimate WTFs, but they're most likely not the things you think. We're going to meander through of bunch of the weird corners of the language -- not the usual suspects -- and then look FORWARD to the new WTFs that ES6 (or ES2015 or whatever) has in store for us. If you're looking for the "bad parts" to avoid, ditch everything you've heard before and "let" these dance in your nightmares.
"Hell is not understanding my own code."
Web Component Markup
Estelle Weyl (@estellew)
No More Tools
Karolina Szczur (@fox)
As creatives we constantly search for ways to optimise and streamline workflows. Currently we’re being bombarded with more tools than ever. But how do we know that we reached a tipping point, when the apparatus we pick introduces more complexity and wastes way more time that it was supposed to save? As craftspeople, how do we maintain simplicity and learn to rely on bare-bones solutions? And more importantly—how do we empower others and collaborate? We’ll have a look at up-to-date front-end tooling and analyse alternative approaches to compiling, building and automation processes as well as the human side of teamwork.
Developing High Performance Websites and Modern Apps with JavaScript and HTML5
Doris Chen (@doristchen)
Creating high performance sites and apps is crucial for every developer. In this session, we will explore the best practices and performance tricks, to make your apps running faster and fluid. A casual game will be illustrated step by step to show how to optimize the game by applying all the optimization strategy. Come learn the tips, tricks, and tools for maximizing the performance of your sites and apps with JavaScript and HTML5.
Lova & Node
Creating relatability Process