JSConfBE 2018
JSConf is a conference held all around the world, adapting to the local communities. Organisation always has focus on two things: pushing the boundaries of what is thought to be conceivable with JS and providing exceptional human social activities. Read on for our highlights.
Babylon.js & Mixed reality
3D in your browser can be achieved with WebGL, should run quite smooth on most devices but is often a nightmare of boilerplate code. Babylon is a framework that promises fast development and high performance for WebGL, WebVR and Web Audio.
It’s targeted towards games, rendering 3D models and VR apps. Provides an api for scene building that reminds of options in 3D software. Creating camera’s, loading models, enabling and disabling shadows to name a few. Support for keyframe animations, a physics engine, a playground tool, VR & controllers make it an all-in-one solution.
I like to mention another talk here. The Web VR/AR talk showed us aframe and React-VR as an alternative to create VR web apps. Aframe is based on web components and makes it easy to build a scene. While React-VR places a pointer in the center of a screen that triggers events. Making it easy to manage the state. There exists a hybrid of these 2 known as React-aframe.
Houdini and motion in React
Javascript is evolving blazing fast. CSS on the other hand, is lagging behind. The main reason behind this is that in javascript, you can use a polyfill to make sure every browser supports your code. CSS has no such thing, forcing devs to wait untill every browser is compatible with the recent features.
Houdini is a working group that seeks to solve this. They want to expose the low level css api so devs can influence the high level api. In this low level api, you have acces to a canvas-like context. An example of what this can do would be a google material button. Ever noticed the click effect starts where you click and how it grows from there? To do this with plain CSS, you would need to save the position it was clicked with javascript and animate it another element from there. If everything goes Houdini’s way, you will be able to write a worklet that draws a circle straight on the background on the position you clicked and animate it from there.
Currently, as said in the Motion in React talk, React devs have to rely on external libraries like React-Transition-Group, React-Motion or React-Pose for animations. Animations are great for UX, as they can give context and indicate relations between elements that you would otherwise not be able to. Perhaps the Houdini work group might be able to provide us with a better workflow?
Fun with bluetooth
Ever wanted to connect to a wearable or another smart device directly from within a progressive web app? Connecting over network might be hard, as devices either don’t support calls or would require HTTP call to an IP, which would be hard in a PWA that can only communicate over HTTPS calls.
In recent Chrome builds however, there is a new API called the Web Bluetooth API. Which allows you to connect to any bluetooth devices that the user selects in a prompt triggered by navigator.bluetooth.requestDevice.
This will result in a bunch of promises you will have to resolve. I guess there’s a reason why we have async functions now. With the ability to read data from and send commands to bluetooth devices, we could do amazing things. Read the heartrate from a patient’s heart rate monitor and send it to the doctor. Or read information from sensors without the need of an internet connection or cable.
But this talk was called “Fun with bluetooth”.
We saw Niels Leenheer show his heart rate, drive lego car, steering with a gaint lego head, draw something and make it show up on a LED grid and finally, control a drone. Using only javascript.
Wrapping up
We had fun and learned a lot on the latest in web development.
JSConf had good talks, a good atmosphere and good food.
I’m Tim, working as a Javascript developer at Aptus. Our mission is to craft digital endpoints for the physical world. We support companies in their new digital ventures by inventing, creating and developing tools, applications and Internet of Things solutions. We are creative technologists who approach innovation differently: we experiment, tinker and make ideas come to life from the earliest moment possible.
