Articles by Belén Albeza
-
Async Pan/Zoom (APZ) lands in Firefox Quantum
Asynchronous pan and zoom (APZ) is landing in Firefox Quantum, which means jank-free, smooth scrolling for all! Until now, scrolling was part of the main JavaScript thread. This meant that when JavaScript code was being executed, the user could not scroll the page. With APZ, scrolling is decoupled from the JavaScript thread, leading to a smoother scrolling experience, especially in slower devices, like mobile phones.
-
Firefox 54: E10S-Multi, WebExtension APIs, CSS clip-path
The release of Firefox 54 completes the transformation of Firefox into a fully multi-process browser, running many simultaneous content processes in addition to a UI process and, on Windows, a special GPU process. This design makes it easier to utilize all of the cores available on modern processors and, in the future, to securely sandbox web content. This release also offers new support for the CSS clip-path property, and updates to the WebExtensions APIs.
-
Shapes in clipping and masking – and how to use them
The general release of Firefox 54 is just around the corner and it will introduce new features into an already cool CSS property: clip-path, a property that allows us to clip (i.e., cut away) parts of an element. With Firefox 54, you will be able to use CSS shapes as well: insets, circles, ellipses and polygons. In this demo-rich post, we'll explore the features of clipping and masking and how they are used.
-
Having fun with physics and A-Frame
A-Frame is a WebVR framework to build virtual reality experiences. It comes with some bundled components that allow you to easily add behavior to your VR scenes, but you can download more –or even create your own. In this post, you can see how to create a VR scene that integrates a physics engine via a third-party component.
-
HTML5 Games Workshop: Make a platformer game with JavaScript!
I have always wanted to run a game development workshop, and some weeks ago, thanks to AdaJS in Barcelona, I finally got my chance. Empezamos con lleno el taller de videojuegos de @ladybenko en @CanodromBCN 👏🏻👏🏻 pic.twitter.com/FWyfcSF16R — adaJS (@adabcnjs) March 4, 2017 Best news? The materials that I created are available online! And you […]
-
A Saturday Night: Track and record movement in WebVR
Mozilla’s WebVR team has released a fun new virtual reality demo called A Saturday Night. Put your VR headset on, perform a dance, and share it with the world!
-
WebGL 2 lands in Firefox
With the release of Firefox 51, WebGL 2 support has landed! WebGL is a standard API to render 3D graphics in the Web. WebGL 2 is based on the OpenGL ES 3.0 specification, and introduces new features – many of them aimed at increasing performance and visual fidelity.
-
A few HTML tips
A while ago I wrote an article with some CSS tips, now it’s time to give some polish to our HTML! In this article I’ll share some tips and advice about HTML code. Some of this guidance will be best suited for beginners – how to properly build paragraphs, use headings, or improve forms, but […]
-
Web Font preloading for HTML5 games
In game development there are two methods of rendering text: via bitmap fonts and vector fonts. Bitmap fonts are essentially a sprite sheet image that contains all the characters of a given font. The sprite sheet uses a regular font file (traditionally .ttf). How does this apply to game development on the Web and HTML5 […]
-
CSS coding techniques
Lately, we have seen a lot of people struggling with CSS, from beginners to seasoned developers. Some of them don’t like the way it works, and wonder if replacing CSS with a different language would be better—CSS processors emerged from this thinking. Some use CSS frameworks in the hopes that they will have to write […]