IMPACT at CSS & JSconf 2018 — Takeaways
IMPACT attended at this year’s edition of CSSconf and JSconf which took place in Berlin, Germany. These two conferences combined had more than 50 speakers, running on two tracks, technical content and visual content — enough for every taste. The venue was set in “Arena Berlin” inside a big industrial building with a raw look, height ceiling and plenty of space to house the roughly 1000 attendees that went through within the 3 days.
This post will be about our experience with these conferences and mentioning some of the most interesting learnings and cool introductions.
CSS DAY 1
It’s obvious that there has become a larger focus from browser-vendors, such as Mozilla and Google who is trying to give a better development- and design experience inside the browser.
The synergy among developers and these companies has grown better these past years. From a request to an actual feature is implemented in the browser, isn’t as trivial as it has been before. Which is easy to see with all the new features getting implemented lately.
Firefox has already lots of new developer features supporting newer CSS functionality, such as the grid-inspector and the shape-editor. They’re even working on a brand-new variable font-editor, which is work-in-progress in the latest nightly build. This feature makes it possible to customize fonts even further; sheriffs or not, height and width adjustment, thickness justification on letters and even more.
Philip Walton’s talk about container-queries, was very promising, an issue which focuses on today’s limitations in the browser. Today we have media-queries which is based on the browser’s viewport. But what if we could have a container-query, a kind-of media-query, that is based on the parent container’s width and style the children accordingly to that element? This would come in handy when we design our markup as components, so they relate to whatever they’re put into, and not the browser’s viewport.
As mentioned, the browser has some limitations in this regard. Philip Walton said the rendering cycle couldn’t handle the flow of “style — layout — paint”, because what should the top parent element relate to when being repainted? The query width or the property width, this could cause an endless rendering loop. Philip Walton has a solution to this, entering the “ResizeObserver”. If you want more information about this matter, see his article right here. This is a very promising feature which hopefully finds it’s way natively into the browser in the nearest future.
JS DAY 2 & 3
The first day at JSconf got kicked off with an awesome JavaScript intro running in a Chrome browser, spanning multiple canvases, loud music (in a good way) and cool effects. Which just highlights the level and quality of the conference we were attending.
This JSconf focused much on new features, which is already available in the browser today. But also, how the TC39 (Technical Committee 39) is shaping the form of JavaScript as we know it. They’re currently working on a new feature called BigInt, to handle big numbers 😃 which is already available in Chrome version 67. They had a QA-panel where the developer could ask questions about everything. They talked about their work progress, from stage 0 features to final features, and how to tag along on their GitHub page.
Charlie Gerard held a very entertaining talk about brain controlled JavaScript. She told about her project, using a real brain-sensor to control her JavaScript applications, either by facial expressions or mental commands. In her presentation she was controlling a keyboard just with a blink of an eye and later on, controlling a 3d space with just a thought. She’s using her own developed open source JavaScript framework called Epoc.js, to control these interfaces together with a brain-sensor called Emotiv. Very exciting stuff, which highlights what JavaScript is already capable of. It’s not just a programming language for the browser anymore.
Phil Nash had some very interesting points for people using push notifications on the web. This is where we as developers must behave ourselves and think twice before using this tool. Push notifications can be turned off globally in the browser, and if badly implemented, destroy other websites implementation of them. Always use these notifications in a meaningful way, don’t cause one on page-load, always setup a context in which these are displayed and create a good way to opt out of them. The push notification is used together with the service worker api and is encrypted by standard. Safari browser support is unfortunately missing.
Ryan Dahl, the original creator of Node.js held a very interesting talk about his own top 10 regrets about Node.js. For example the GYP compiler, the package.json, and the famous node_modules. Furthermore, how a big project as Node.js can turn into something unwanted, implementing a feature which seems right at the development time, but after all it turns out to be the wrong implementation.
He also talked about a new kind-of Node.js project he has been working on for about a month, called Deno. Certainly, something to watch out for as it evolves. Could it be a Node.js replacement in the future, who knows?
You can see his entire talk here to learn more about his regrets or deep dive further into his new project, Deno. Really exciting stuff.
Performance was also a big topic, regarding how to handle offline or low-connectivity areas within your app/website, among others. Perhaps start looking into caching, HTML structure and put the most essential content first. A content delivery network could also give a boost, or maybe you need an offline first-strategy, which is already supported today. Chrome even has a way to simulate an offline environment (check it out in the devtools under the network tab).
If you have some very heavy calculations, perhaps you should look into the WebAssembly (wasm) world. In this way, you are closer to the core of the computer, which greatly improves speed, as it’s nearly as fast as running native machine code.
There were also tips on how to create better solutions and features, not only for the end user but also for your colleagues and fellow developers. Think about error handling, code-comments, and breaking changes if you’re creating modules. Update your documentation and stick to a semver convention for handling version updates. Use automatically test to catch some of the unforeseen errors in your app.
Sponsors, food and arrangement
The organizers did a really great job, getting everyone to feel welcome and to have a great time. There were childcare, vegetarian food and fresh beverages in refrigerators all over the venue.
The sponsor booths were filled with companies from Mozilla, Google, Facebook, Twilio, Zalando, Microsoft and many more. They were all very open-hearted, offering a talk, a t-shirt or some stickers for all the guests. The new Kickstarter-company Neonious offered a small JavaScript IoT microcontroller for everyone, to take home and play with.
All in all, a very good experience and very well executed from food, sponsors to speakers. 👍
