Browser support, from hand-rolled to enforced

The browser-side build of Collabora Online had been quietly accumulating cruft: hand-maintained -webkit-, -moz-, -ms- and -o- vendor prefixes spread across many different CSS files, and no automated way to tell whether a given JavaScript API actually worked on the browsers our customers run. We had a vague sense of “modern enough”, but no rules.

One source of truth

We added an explicit browserslist to browser/package.json with absolute version floors:

“Chrome >= 120”, “Firefox >= 128”, “Safari >= 16.4”, “iOS >= 16.4”, “ChromeAndroid >= 120”, …

Floors are fixed for the lifetime of a yearly major release and bumped only at the next major. Bumping support is now a one-line diff, reviewed deliberately.

Two gates that enforce it

– autoprefixer (CSS) inserts vendor prefixes for exactly the targeted browsers at build time. Source CSS is now unprefixed.

– eslint-plugin-compat (JS) reads the same browserslist and errors when source uses runtime APIs not supported across the target set.

The size bonus

While we were in there, we replaced uglify-js with terser and bumped TypeScript’s target from ES5 to ES2022. The production bundle dropped from 4.50 MB to 3.34 MB, a 25.8% saving served on every (uncached) document open.

Leave a Reply

We use cookies to help our website work and improve your experience.
Read our Privacy Policy for more details.

We use cookies

We use cookies to improve your experience on this website. You may choose which types of cookies to allow and change your preferences at any time. Disabling cookies may impact your experience on this website. You can learn more by viewing our Cookie Policy.