MDN-Browser-Compatibility-Report-2020

I used the DOM mutation API recently and that was well supported on all the browsers I tested. Things are fairly good now, it's not like the old days where there was a big gulf between browsers.

WebAPls

How about Web APls?

For the most part they're pretty complete. I'd say the biggest issue is not so much the API itself not being implemented, but parts of API not being implemented in certain browsers. For "scroll to element", there's a "smooth" property that some browser's don't... I think it's Safari that doesn't support the smooth object property in the scroll to element API. We just added a polyfill for it, it's like 2 KB so it's not a big deal. Fortunately the build systems we have are pretty good at putting in a polyfill for what's not widely supported.

Responsive layout

Last time you had a problem between desktop and mobile?

We use a grid system from a project called Vuetify, which is part of the Vue ecosystem. It's based on the Bootstrap grid system. It's well tested, it's cross-browser, so fortunately we don't have to worry too much about layout issues. [...] Just having a grid system that's well supported and tested by other parties is a super helpful tool.

No longer supporting IE, what kinds of benefits are you getting from a grid system?

It's something that we use in every component. Our design team is using a grid system in Zeplin and Figma, which are their tools. We actually did kind of a sprint to align with Zuchrids. [?] So now we have the Vuetify grid system using the same breakpoints and columns, gutters and things like that as the design team is using. Having those in sync now makes our development so much easier, and it makes us not have to worry about "are these columns lining up correct" or "are they collapsing when they should?"

Any other browser than IE a problem for Flexbox/Grid?

Made with FlippingBook - professional solution for displaying marketing and sales documents online