For more articles, check out the WebAssembly category on Hacks: hacks.mozilla.org/category/webassemblyMDN Plus: More MDN, Your MDN.Mozilla Hacks2022-03-24 | New features and tools to customize your MDN experience with MDN Plus, our premium subscription.Contribute to MDN Web DocsMozilla Hacks2021-12-09 | MDN Web Docs is an evolving learning platform for Web technologies and the software that powers the Web. MDN's mission is simple: to provide developers with the information they need to easily build projects on the open Web.
Every part of MDN (docs, demos, and the site itself) is created by an open community of developers building resources for a better Web, regardless of brand, browser, or platform. Anyone can contribute, and each person who does makes us stronger. Together we can continue to drive innovation on the Web to serve the greater good. It starts here, with you. developer.mozilla.org/en-US/docs/MDN/ContributeAdjusting SpiderMonkey to account for a Normative Change in ECMA-262Mozilla Hacks2020-11-13 | TC39 happened two weeks ago, and one of the changes was a small adjustment which specifies the order of properties on builtin functions. We take a look at how to solve that in this episode.Fixing wrong error messages for Private FieldsMozilla Hacks2020-11-13 | In a self contained episode, we look at a small bugs around an incorrect error message found when accessing something that looks like a private field in JavaScript.Compiler Compiler - Part 7: Finally finished the bug!Mozilla Hacks2020-11-13 | After a long and grueling journey, we finish a complete implementation of the prepareSetElem bytecode. It is implemented in all of the jits (warp, ion, and baseline) and the interpreter.Compiler Compiler - Part 6: From the Baseline compiler to Ion and beyondMozilla Hacks2020-07-28 | In this episode, SpiderMonkey engineer Yulia Startsev covers Inline Caches (ICs), and how to move from the Baseline compiler to the Ion compiler. Along the way, she covers optimizing compilers, and walks through the conclusion of the bug fix/implementation task set out on in Episode 1.
Recording of a twitch live stream from Friday, July 10.
You can follow Yulia's live stream on twitch.tv: twitch.tv/codehag or get more information on the Mozilla Developer portal: https://mozilla.dev/events/compiler-compiler-yulia-startsev/
The stream will resume on August 7.Compiler Compiler - Part 5: Implementing JS in 2 places at once—Baseline Interpreter & CompilerMozilla Hacks2020-07-28 | Yulia Startsev works on implementing correct ECMAScript in Firefox's SpiderMonkey engine. In this episode, Yulia covers moving from the interpreter to the baseline interpreter, and understanding the difference between interpreters and compilers.
Recording of a twitch live stream from Friday, July 3.
Learn more about upcoming episodes and related resources on the Mozilla Developer portal: https://mozilla.dev/events/compiler-compiler-yulia-startsev/Compiler Compiler - Part 4: What is Bytecode?Mozilla Hacks2020-07-27 | In the fourth episode of her guided tour, SpiderMonkey engineer Yulia Startsev picks up where she left off, exploring the implementation of the ECMAScript spec in Firefox's JavaScript engine. She begins with a problem around consistency in the prefix increment test (a test262 bug) that's been the topic of the last 3 streams.
Looking for some visual orientation? Don't miss Yulia's companion zine introducing bytecode: http://hag.codes/images/bytecode-zine.pdf
Recording of a twitch live stream from Friday, June 26.
You can follow Yulia's live stream on twitch.tv: twitch.tv/codehagCompiler Compiler - Part 3: Debugging SpiderMonkey continuedMozilla Hacks2020-06-24 | Continuing on from the stream two weeks ago (Compiler Compiler Part 1) we will look at the finishing work for the pre-increment bug, before moving on to our next (related) issue.
This video is about debugging SpiderMonkey, Firefox's JavaScript engine. Engineer Yulia Startsev picks up where Part 1 left off, looking at a failed test, and how to fix it.
Recording of a twitch live stream from Friday, June 12.
Stay tuned.Compiler Compiler - Part 1: Fixing a bugMozilla Hacks2020-06-24 | A guided tour with SpiderMonkey engineer Yulia Startsev. Yulia shows what it’s like to work on the SpiderMonkey compiler as a JavaScript engineer, improving conformance with ECMA-262, the #JavaScript Specification, one bug fix at a time.
Recording of a twitch livestream from Friday, May 29.
You can find Yulia's next live stream on twitch.tv: twitch.tv/codehag
Join us there on Tuesday, June 9, 15:00 UTC (8am PST, 17:00 CEST) for a fireside chat about the most recent TC39 meeting.Compiler Compiler - Part 2: TC39 and how JavaScript gets madeMozilla Hacks2020-06-24 | Curious about how JavaScript gets standardized? Join us for a chat - and an update - about the most recent TC39 meeting. Questions will be answered and a little bit about the process explained.
Yulia Startsev shares how the JavaScript specification evolves and is implemented in code in SpiderMonkey, Firefox's JavaScript engine, and other JS engines.
Recorded from Yulia's twitch livestream on June 9, 2020.
You can follow Yulia's live stream on twitch.tv: twitch.tv/codehagInterview with Stan LeongMozilla Hacks2020-02-17 | Stan Leong describes Mozilla's current activities in Emerging Markets. (We regret that subtitles are not currently available for this video).Designing for User-Centered Privacy - by Venetia Tay - Mozilla Developer Roadshow - SingaporeMozilla Hacks2020-01-21 | Head of Audience Insights at Mozilla, Venetia Tay describes the research her team has done to arrive at their user-centric perspective on privacy in the browser.Percentage Rollout Single Page Web Apps - Sri Subramanian - Mozilla Developer Roadshow - SingaporeMozilla Hacks2020-01-21 | A presentation by Singapore-based Grab engineer Sriraghavan Subramanian describes optimization of single page apps using techniques from the backend.Lets Talk About Web Compat - Karl Dubost and Daisuke Akatsuka - Mozilla Developer Roadshow - SeoulMozilla Hacks2020-01-21 | Karl Dubost introduces webcompat.com and speaks about the challenges of browser compatibility. His Mozilla colleague Daisuke Akatsuka speaks about Firefox DevTools and a browser compatibility-checker tool that's under development.An IoT Forecast Thats Sunny and Clear - by Kathy Giori - Mozilla Developer Roadshow - SingaporeMozilla Hacks2020-01-21 | Kathy Giori introduces Mozilla WebThings, which offers a private, secure, and interopable IoT solution that's not dependent on storage in the cloud.10 things I hate about animation - by Brian Birtles - Mozilla Developer Roadshow - SeoulMozilla Hacks2020-01-21 | Brian Birtles shares his pet peeves about web animation, and offers some technological solutions.10 things I hate about animation - by Brian Birtles - Mozilla Developer Roadshow - Tokyo (Japanese)Mozilla Hacks2020-01-21 | (Presented in Japanese; includes English subtitles) Brian Birtles shares his pet peeves about web animation, and offers some technological solutions.Developing for Mixed Reality on the Open Web Platform - Philip Lamb - Mozilla Dev Roadshow - TaipeiMozilla Hacks2020-01-21 | New Zealand based Research Engineering manager Phil Lamb describes Mozilla's Mixed Reality offering and the web platform that's underlying.Making CSS From Good to Great - by HJ Chen - Mozilla Developer Roadshow - SeoulMozilla Hacks2020-01-21 | Singapore-based developer advocate Hui Jing Chen opens her CSS Subgrid talk in Korean (presentation in English).Making CSS From Good to Great HJ Chen - Mozilla Developer Roadshow - Singapore (Singlish)Mozilla Hacks2020-01-21 | (Presented in Singlish, a Singaporean English creole) Singapore-based developer advocate Hui Jing Chen introduces CSS Subgrid.Stan Leong - Mozilla Vice President for Emerging Markets - Mozilla Developer Roadshow - TaipeiMozilla Hacks2020-01-21 | Stan Leong describes Mozilla's activities in Emerging Markets.Max Liu - Learn more about Firefox Lite - Mozilla Developer Roadshow - Taipei (Chinese)Mozilla Hacks2020-01-21 | (Presented in Chinese; includes English subtitles) Max Liu, Mozilla Engineering Manager for Emerging Markets, describes Mozilla's activities in creating Firefox Lite.Lets Talk About Web Compat - Daisuke Akatsuka & Karl Dubost - Developer Roadshow - Tokyo (Japanese)Mozilla Hacks2020-01-21 | (Partially presented in Japanese; includes English subtitles) Karl Dubost introduces webcompat.com and speaks about the challenges of browser compatibility. His Mozilla colleague Daisuke Akatsuka presents in Japanese about Firefox DevTools and a browser compatibility-checker tool that's under development.Making CSS From Good to Great - by HJ Chen - Mozilla Developer Roadshow - Taipei (Chinese)Mozilla Hacks2020-01-21 | (Presented in Chinese; includes English subtitles) Singapore-based developer advocate Hui Jing Chen presents her CSS Subgrid talk.Welcome & Mozilla Update - by Ali Spivak - Mozilla Developer Roadshow SeoulMozilla Hacks2020-01-18 | An overview of what we are working on at Mozilla - from new Firefox releases to WASM and much more! Ali Spivak is the Director of Developer Relations at Mozilla, and leads Mozilla’s developer documentation (MDN), content, events, and community participation initiatives.Lightning Talks - The Web We Want - View Source 2019Mozilla Hacks2019-12-04 | #MaximTsoy #hiddedevries #webwewant #viewsourceconf #artemdenysov #Paul Veerbeek-Mast
A collection of four short talks each focused on a feature or capability that is missing from the web today, that the speaker would like to see developed.
Introduced and moderated by Paul Veerbeek-Mast.
Presenters:
Alistair Coote Maxim Tsoy Hidde de Vries Artem Denysov
The judging panel for these four talks consists of View Source presenters Ali Spittel, Jory Burson, and Hui Jing Chen. Both judges and audience will have an opportunity to vote for their favorite proposal.Clips from US events on the Developer Roadshow 2019Mozilla Hacks2019-12-04 | The Mozilla Developer Roadshow is a meetup-style, Mozilla-focused event series for people who build the web. In 2019, we participated in the Future of Everything Festival in New York (May 20-23) and also presented at Loyola Marymount University in Los Angeles (April 23rd).Jeremy Keith - Building - View Source 2019Mozilla Hacks2019-11-29 | #jeremykeith #viewsourceconf #patternlanguages
Every new medium looks to what has come before for guidance. Web design has taken cues from centuries of typography and graphic design. Web development has borrowed metaphors and ideas from the world of architecture. Let's take a tour of some of the most influential ideas from architecture that have crossed over into the web, from pattern languages to responsive design. Together we'll uncover how to build resilient, performant, accessible and beautiful structures that work with the grain of the materials of the web.Tejas Kumar - CSS on Today’s Web Platform - View Source 2019Mozilla Hacks2019-11-29 | #@tejas_kumar #tejascumar #CSS #viewsourceconf This talk covers CSS as we know it today, alluding to the specification's colorful (pun intended) past and examining how things have evolved: from clear: both; to grid. We will explore pragmatic solutions to problems web developers consistently face with CSS, as well as talk in-depth about upcoming CSS APIs and conventions that extend the language and allow a wider community to contribute to its ever-growing featureset.
Please note the following links for attribution from Tejas Kumar's slides:
Given the recent demise of Presto and EdgeHTML rendering engines, and dominant market share growth for Chrome (and its Chromium engine), can we make a case for browser engine diversity in a decreasingly diverse browser engine world? In this talk, we’ll talk about web compatibility, interoperability, the web standards process, and hopefully conclude that we should care about these things in 2019.Saron Yitbarek and Jeremy Keith - Command Line Heroes Live Podcast - View Source 2019Mozilla Hacks2019-11-29 | #jeremykeith #saronyitbarek #javascript #commandlineheroes #viewsourceconf Command Line Heroes (an original podcast from Red Hat) shines a light on the developers, programmers, hackers, geeks, and open source rebels transforming the world of tech.
Direct from the View Source conference in Amsterdam, Saron Yitbarek hosts this live version of the "Creating JavaScript" episode. Jeremy Keith will join her to talk about how a last-minute moonshot became one of the biggest programming languages of the web.Sharell Bryant - Is the site fast yet? - View Source 2019Mozilla Hacks2019-11-29 | #sharellbryant #performance #viewsourceconf As the owners of web performance, my team is often asked some version of the question “Is the site fast yet?”. While it sounds simple, it's actually impossible to answer without asking more questions. “Is our site fast in New York but slow in Sydney? Is it fast on all devices or just on desktop? How fast is fast enough and most importantly, what does fast even mean?”. In this talk, I’ll share what we've learned while finding an answer to this question, including how to conduct a performance audit, how to talk about performance with your teammates outside of engineering, and how to advocate for your users by making performance a priority.Surma - Polyglot WebAssembly - View Source 2019Mozilla Hacks2019-11-29 | #wasm #webassembly #surma #viewsourceconf The number of languages with WebAssembly support is growing. And you don't have to choose just one. You can use each of them for what they are good at. You can sprinkle in some C, C++, Rust, AssemblyScript (and more) as enhancements for your everyday-JS.Kenji Baheux - The Web in Different Parts of the World - View Source 2019Mozilla Hacks2019-11-29 | #kenjibaheux This talk will provide insights about markets that tend to be not well-understood such as India or Indonesia. The goal is to provide an overview of what makes these markets interesting but challenging, e.g. data about the device landscape, state of the web and native apps, connectivity challenges and evolution, opportunities. Parallels will be drawn to more familiar markets to show that efforts motivated by these markets can also benefit other markets.Hui Jing Chen - Demystify Modern CSS Layouts with DevTools - View Source 2019Mozilla Hacks2019-11-29 | #viewsourceconf #huijingchen #CSSLayout #CSS #devtools #firefoxdevtools Flexbox, Grid and Box alignment properties are powerful and versatile new additions to our web development toolkit. However, they may be slightly confusing to wrap your head around if you do not completely understand how browsers interpret the CSS values you assign. Although we tend to associate DevTools with debugging, Firefox DevTools comes with features that can help visualise how these properties work, and better understand what's going on as the viewport size changes.Paul Irish and Elizabeth Sweeny - Demystifying Speed Tooling - View Source 2019Mozilla Hacks2019-11-29 | #paulirish #elizabethsweeny #performance #speedtooling
This talk will provide an overview on how to effectively assess and optimize site performance using a slew of industry grade tooling. Learn how to methodically diagnose, benchmark (against both lab and field metrics), and monitor your site speed using these tools.Lilian Kravitz and Ryan Cropp - Privacy Initiative on the Web - View Source 2019Mozilla Hacks2019-11-29 | #lilliankravitz #ryancropp #privacy #viewsourceconf As creators of the web we have a responsibility to protect users privacy. This talk will discuss forming privacy principles and how listening to customers helps us know what problems to solve. We will dive into user research and how that drives changes to online privacy. We will explore the challenges of providing users with the balanced level of transparency, control and education about their online privacy. Lastly, we will look forward towards the future of privacy.Browser Panel: Commitments to the Web Platform - View Source 2019Mozilla Hacks2019-11-29 | #viewsourceconf #browsers #webstandards #webplatform A panel discussion about the browser and the web platform, moderated by Daniel Appelquist (Samsung Internet). Panelists include: Ahmad Nassri (npmjs), Heejin Chung (Samsung), Andreas Bovens (Mozilla), Kenji Baheux (Google), Melanie Richards (Microsoft), and Dees Chinniah (Grant for the Web).Henri Helvetica - The Shape of the Web - View Source 2019Mozilla Hacks2019-11-29 | #henrihelvetica #viewsourceconf “The Shape Of The Web” is about both accomplishments and challenges that lay in the past and present of the web. In his opening keynote, Henri Helvetica looks back in time and forward into the future, at the technologies the web has employed, but also at the future of its employed technologists.
He remembers the textual academic web of the early 1990s, and the sea change that came when a browser allowed for both text and images to be displayed in the viewport. And he identifies some of today’s challenges in ensuring that the “gateway to the riches of the internet” remains open and inclusive for all.Jory Burson - Standardizing JavaScript - View Source 2019Mozilla Hacks2019-11-29 | #@jorydotcom #joryburson #webstandards #javascript We'll take a deep-dive into the standards process, it's history, and the economic and policy implications for the JavaScript standard.Selena Deckelmann - Our Privacy and the Web - View Source 2019Mozilla Hacks2019-11-29 | #@selenamarie #privacy #selenadeckelmann #firefox #viewsourceconf
Privacy is the how we form our sense of self, become individuals and form relationships. It’s also how we form critical thoughts, and then decide whether we share them. Sometimes we invent technology that helps with this.
Mozilla’s founders believed privacy to be such an important concept that they enshrined it in our manifesto here. Mozilla Privacy Principle #4 is Individuals’ security and privacy on the internet are fundamental and must not be treated as optional. This principle guides much of the privacy technical work we do, balanced against social and political realities.
This talk describes some of the work Firefox does to combat online surveillance and ensure user privacy and security.Melanie Richards - The Tailored Web: Effectively Honoring Visual Preferences - View Source 2019Mozilla Hacks2019-11-29 | #@somelaniesaid #melanierichards #accessibility #a11y #viewsourceconf The web platform is evolving to support more native capabilities, including integration with a user's OS-level settings. By using new CSS standards to honor a user's preferences around contrast and color scheme, we can craft more inclusive and accessible websites. In this talk, Melanie covers the difference between these emerging standards, considerations that shaped their design and application, and strategies for effectively supporting your users—while maintaining a design point-of-view.Stefan Thomas - Web Monetization: An Alternative to Ads - View Source 2019Mozilla Hacks2019-11-29 | #viewsourceconf #coil #grantfortheweb #webmonetization #stefanthomas Independent creators on the web today are increasingly forced into a handful of content platforms. Web Monetization is a proposed new web standard which provides an alternative to ads and site-by-site subscriptions. It has the potential to level the playing field between indie creators and giant tech companies.Kadir Topal - MDN Web Developer Needs Assessment - View Source 2019Mozilla Hacks2019-11-29 | #kadirtopal #MDNsurvey #developerneedsassessment "The voice of developers and designers working on the web." An account of the design and execution of this vast collaborative 2019 survey of over 10,000 web developers and designers worldwide to better understand developer pain points, and prioritize browser and platform feature development.Ali Spittel - Web Ready Augmented Reality in 47 Lines of Code - View Source 2019Mozilla Hacks2019-11-29 | #alispittel #AugmentedReality #viewsourceconf
Augmented reality is becoming more popular for both its artistic and business applications. This talk will explore the frameworks and tools that make AR more developer friendly, including adding live masks to a webcam image in 47 lines of JavaScript!Standards Group Panel: What are Standards Groups - View Source 2019Mozilla Hacks2019-11-29 | #webstandards #standards #ecma #tc39 #viewsourceconf
A discussion with participants from Ecma's TC39 standards body: Yulia Startsev, Aaron Parecki, Wendy Seltzer, Natasha Rooney, moderated by Jory Burson. They panel discusses how standards are made and how stakeholders come together to collaborate and move the web forward.Understanding modern CSS layouts with Firefox DevTools - by HJ Chen | Mozilla Developer Roadshow EUMozilla Hacks2019-10-11 | We often think of DevTools for debugging purposes, but in recent years, Firefox DevTools have become more than that. The newer layout properties like Flexbox and Grid introduce behaviours that might seem confusing at first, but Firefox DevTools provides features that can help us better understand how the browser interprets the CSS values we assign.
Hui Jing Chen is a self-taught designer and developer living in Singapore, with an inordinate love for CSS, as evidenced by her blog, that is mostly about CSS, and her tweets, which are largely about typography and the web.Engineering for privacy in Mixed Reality - by Diane Hosfelt | Mozilla Developer Roadshow EUMozilla Hacks2019-10-11 | Mixed reality devices use always-on cameras and sensors to overlay virtual elements on the physical world. User privacy is an existential and essential question for this technology. This talk offers an overview of Mozilla’s approach to building an immersive web browser and a social VR platform that empowers users.
Diane Hosfelt is the security lead for the Mixed Reality team at Mozilla and works closely with the Rust Project to improve security with formal methods and unsafe code guidelines.An Update on Firefox and Mozilla, Summer 2019 - by Ali Spivak | Mozilla Developer Roadshow EUMozilla Hacks2019-10-11 | An overview of what we are working on at Mozilla - from new Firefox releases to WASM and much more!
Ali Spivak is the Director of Developer Relations at Mozilla, and leads Mozilla’s developer documentation (MDN), content, events, and community participation initiatives.