Done in November
- Shipped monthly MDN Payments
- Converted from Font Awesome to SVG
- Added browser names to compatibility tables
- Welcomed David Flanagan
- Shipped tweaks and fixes by merging 248 pull requests, including 35 pull requests from 30 new contributors.
Here’s the plan for December:
Shipped monthly MDN payments
Potato London started work on this shortly after one-time payments launched. We kicked it off with a design meeting where we determined the features that could be delivered in 4 weeks. Potato and MDN worked closely to remove blockers, review code (in over 25 pull requests), and get it into the staging environment for testing. Thanks to everyone’s hard work, we launched a high-quality feature on schedule.
We’ve learned a lot from these payment experiments, and we’ll continue to find ways to maintain MDN’s growth in 2019.
Converted from Font Awesome to SVG
On November 6th, we deployed Schalk Neethling’s PR 5058, completing the transition from the FontAwesome webfont to inline SVG icons. There are a few icon and style changes, but the site should look the same to most users.
We had several reasons for this change in April, when Schalk started the project. The biggest gains were expected to be in performance and a simpler design. Over the year, we became aware that many content blockers prevent loading web fonts, and many users couldn’t see UIs that depended on icons. For example, the browser compatibility tables were unusable on mobile with Firefox Focus. This change fixes this issue.
We haven’t seen a significant performance improvement, although there may have been small improvements as this switch was rolled out over the year. This month, we explored some more radical changes, such as minimal styling and disabled JS, by shipping manually edited copies of wiki pages. These experiments will help us determine the highest impact changes for front-end performance, and provide insight into what areas to explore next.
Added browser names to compatibility tables
The new SVG icons are being used in the browser compatibility table. In the wider desktop view, we’ve added rotated browser labels (Kuma PR 5117 and KumaScript PR 997), so it is clearer which browser is which. We also launched a survey to ask visitors about their needs for compatibility data (Kuma PR 5133).
Welcome David Flanagan
Shipped tweaks and fixes
There were 248 PRs merged in November:
- 74 mozilla/kuma PRs
- 59 mdn/browser-compat-data PRs
- 34 mdn/kumascript PRs
- 21 mdn/interactive-examples PRs
- 19 mdn/infra PRs
- 12 mdn/bob PRs
- 11 mdn/data PRs
- 3 mdn/dom-examples PRs
- 2 mdn/django-locallibrary-tutorial PRs
- 2 mdn/web-speech-api PRs
- 2 mdn/stumptown-experiment PRs
- 2 mdn/short-descriptions PRs
- 1 mdn/fetch-examples PR
- 1 mdn/web-components-examples PR
- 1 mdn/learning-area PR
- 1 mdn/simple-web-worker PR
- 1 mdn/crossbrowser-testing-lab PR
- 1 mdn/css-examples PR
- 1 mdn/imsc PR
This includes some important changes and fixes:
- Add ARIA roles to notes and warning boxes inside CKEditor (Kuma PR 5069), from Schalk Neethling.
- More migration from Python 2 to Python 2/3 (Kuma PR 5071), from Anthony Maton.
.blockIndicatorfor styling note and warning boxes (Kuma PR 5079), from ExE Boss.
- Improve functional tests (Kuma PR 5143), from Ryan Johnson.
- Fix deployments by fixing issue with the Jenkins build step (Interactive Examples PR 1229), from Ryan Johnson.
- Enforce CSP in staging (infra PR 157), from me.
35 pull requests were from first-time contributors:
- Support sticky table of contents on Safari (Kuma PR 5113), from Anthony Ricaud.
- Upgrade clean-css to version 4.x (PR 5135), and Stop adding the SEO root title to all document titles (PR 5142), to Kuma from David Flanagan.
intrinsicsizeto HTML Media elements (
video) (PR 2979), from ZaneHannanAU (first contribution to BCD).
- Update browser compatibility for rest properties in objects (BCD PR 3038), from FichteFoll.
indexcompatibility for IE and FF (BCD PR 3039), from Tim.
- Add compatibility for
FullScreenAPI on IE11 (BCD PR 3040), from CntChen.
- Fix tag escaping in Edge note for
FileSystemAPI (BCD PR 3043), from Ryusei YAMAGUCHI.
object-positionSafari Support Details (BCD PR 3045), from Holt Johnson.
- Add support data for the
signalfeature from the
AbortControllerAPI (PR 3048), from Konstantin Rouda (first contribution to BCD).
- Update Firefox compatibility for
Window.event(BCD PR 3057), from Matthieu Riegler.
aspect-ratiofor Safari on iOS (BCD PR 3066), from Eric Celeste.
- Add and rename image directives of Feature Policy (BCD PR 3095), from Jason Chase.
- Add support for
<meter>in iOS Safari 10.3 (BCD PR 3109), from Sven Wolfermann.
- Update “Tracking Preference Expression (DNT)” Editor’s draft URL (KumaScript PR 805), from Vivien Lacourba.
- Change WebDriver to Living specification (PR 930), from Andreas Tolfsen (first contribution to KumaScript).
- Add Spanish support to
Glossarymacro (KumaScript PR 968), from Joaquín Serna.
- Update French string in
SeeCompatTable(KumaScript PR 975), from lp177.
<audio>example to valid and more semantic HTML (PR 1236), from Karl Stolley (first contribution to Interactive Examples).
grid-arealabel indicators to
divcontent (Interactive Examples PR 1248), from Liz Lawley.
-webkit-overflow-scrollinginheritance (Data PR 331), from Timothy Liang.
- Add chroma keying example (PR 29), Add web crypto examples (PR 30), and Remove web crypto examples (PR 31), from wbamberg (first contributions to dom-examples).
- Fix indenting of
display_genre.short_description = 'Genre'(django-locallibrary-tutorial PR 33), from AlekseiMarinichenko.
speechResultto lowercase to fix phrase matching (web-speech-api PR 29), from Hartmut Bohnacker.
- In the synthesis demo, list the voices into alphabetical order (ignoring case) (web-speech-api PR 30), from Chris Chittleborough.
- Add recipes (PR 1), and Add CSS property transform (PR 3), from wbamberg (first contributions to stumptown-experiment).
- Add error handling to multiple fetch examples (fetch-examples PR 13), from T.J. Crowder.
editable-listexample (web-components-examples PR 13), from liuxuewei.
flexto match Firefox’s wrapping in Safari and Chrome (learning-area PR 108), from stefsulzer.
- Vary console messages to distinguish between handlers (simple-web-worker PR 10), from Bharath Bhushan Lohray.
- Update README to reference MDN docs (crossbrowser-testing-lab PR 1), from James Thompson.
- Add grid wrapper example to CSS Layout Cookbook (css-examples PR 12), from Michelle Barker.
Planned for December
Meet in Orlando
Twice a year, all of Mozilla comes together for an All-Hands meeting. This winter’s All-Hands is in Orlando, Florida. We were in Orlando in December 2015, when Florian was proposing moving KumaScript macros to GitHub and I was deploying the BrowserCompat API to beta users. A lot changes in three years!
Many of us at MDN will be taking well-deserved breaks after the All-Hands, and will come back refreshed for 2019. We hope you and yours have an enjoyable winter break!
About John Whitlock
John is a web developer working on the engine of MDN Web Docs