Articles
-
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.
-
Cross-browser extensions, available now in Firefox
We’re modernizing the way developers build extensions for Firefox! We call the new APIs WebExtensions , because they’re written using the technologies of the Web: HTML, CSS, and JavaScript. And just like the technologies of the Web, you can write one codebase that works in multiple places.
-
Introducing FilterBubbler: A WebExtension built using React/Redux
We're building a text analysis toolkit with the new WebExtensions API. This toolkit will let you monitor various browser activities and resources (history, bookmarks, etc.) and then let you use text analysis modules to discover patterns in your own browsing history. The idea was to turn the tables on the kinds of sophisticated analysis that advertisers do with the everyday browsing activities we take for granted. We're building this project using React/Redux tooling, and in this post we walk you through some of our design challenges and the decisions we made.
-
Announcing WebVR on Mac via Firefox Nightly
Mozilla is pleased to announce WebVR is now available for macOS today via Firefox Nightly. This follows our announcement last week that WebVR is shipping in Firefox 55 for Windows. More than 20% of Hacks readers (on desktop) and a quarter of web developers accessing the Mozilla Developer Network are on macOS. Many developers go […]
-
VR development from the comfort of your regular environment
If you’re new at developing VR content, maybe you’ve recently switched to a Windows PC. Coming from Mac and Linux systems, switching to and from Windows can be a challenge. If this is your situation too, here’s a walkthrough of one developer's setup for working with virtual reality, that maintains the comfort of a familiar context and minimizes disruptive context switches.
-
Showcasing your WebVR experiences
WebVR combines the powerful reach of the Internet with the immersive appeal of virtual reality content. With WebVR, a VR experience is never more than one URL away. Nevertheless, VR equipment is still expensive and not quite adopted for consumer use. For this reason, it is useful to be able to record your VR projects for others to experience and enjoy. This tutorial teaches you how to record a virtual experience you’ve created using the mirror mode in SteamVR.
-
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.
-
Debugger.html Call Stack Improvements
Debugger.html is an open source project, built on top of React and Redux, that functions as a standalone debugger for Firefox, Chrome and Node. The debugger is also being integrated into the Firefox Developer Tools offering. Currently it is available in the Firefox 53 release behind the devtools.debugger.new-debugger-frontend preference.
-
Quantum Up Close: What is a browser engine?
A web browser is a piece of software that loads remote files and displays them locally, allowing for user interaction. Quantum is the code name for an project we’ve undertaken at Mozilla to massively upgrade the Firefox browser engine. In this post, we'll start from the beginning, by explaining the fundamental thing Quantum is changing and why you should care.
-
Debugging Web Push in Mozilla Firefox
Web Push has a large number of "moving parts", systems and components that need to work together in order for your message to be successfully sent and received. One of the challenges with implementation issues is trying to figure out what went wrong. In this article, we offer suggestions and insight into best using and debugging the service.
