Skip to content
This repository has been archived by the owner on Jun 9, 2023. It is now read-only.

Browser Support Matrix #144

Closed
nik-john opened this issue Oct 24, 2019 · 9 comments
Closed

Browser Support Matrix #144

nik-john opened this issue Oct 24, 2019 · 9 comments

Comments

@nik-john
Copy link
Contributor

nik-john commented Oct 24, 2019

Browser Support Matrix

We should define a Browser Suppor Matrix like @ceciliaconsta3 mentioned here. For the MVP I personally think it's good enough to support latest - 2 Chrome (desktop, android), Firefox, Safari (Desktop, iOS), IE10+ & Edge.

However, because this is going to be an totally public facing app allowing us no control over what Geography, Device or Networks it will be used in, we will need to support pretty much all possible scenarios including Opera Mini and UC Browser. Even if we don't develop for these two, the app should work on them and we should definitely follow Progressive Enhancement.

The steps involved are:

Define the Audience

  • Geography: I'm assuming here that we plan to eventually support all geographies, the only requirement being that you have a working internet connection and some smart phone.

  • Devices (Form Factors): Again, here I assume we will support all Android, iOS and Desktop devices of any form factor, with a min. device width of ~200px.

Research User’s Browser Share

Worldwide browser usage

image

image

Screen Shot 2019-10-24 at 3 23 25 PM

Screen Shot 2019-10-24 at 3 23 37 PM

Screen Shot 2019-10-24 at 3 23 50 PM

Screen Shot 2019-10-24 at 3 24 03 PM

Screen Shot 2019-10-24 at 3 24 12 PM

Insights:

  • Chrome, Safari, Firefox are expectedly the most popular browsers and will need to be supported across the board
  • On Desktop, we will not run into any major issue as long as any of these browsers are used, but potentially run a risk of degraded performance on older versions of IE
  • On Mobile, Opera, Opera Mini and UC Browser still command a substantial share (greater than IE) and cannot be ignored

Define Support Grades

A: Fully supported browser. All functional and visual bugs should be fixed.

  • [ ]
  • [ ]
  • [ ]
  • [ ]

B: Partially supported browser. Functionality needs to be tested and given but visual appearance can differ slightly

  • [ ]
  • [ ]
  • [ ]
  • [ ]

C: Rudimentary supported browser. Functionality should be ensured, although only core-features need to work. Visual bugs can appear.

  • [ ]
  • [ ]
  • [ ]
  • [ ]

D: Not supported browser.

  • [ ]
  • [ ]
  • [ ]
  • [ ]

TBD

My recommendation is that all P0 features should be developed so they work on at least all Tier B Browsers. Progressive Enhancement features can be built so they work on only Tier A browsers. Degraded performance is fine on Tier C and Tier D.

@nik-john nik-john mentioned this issue Oct 24, 2019
18 tasks
@nik-john nik-john changed the title Browser Suppor Matrix Browser Support Matrix Oct 24, 2019
@allella
Copy link
Contributor

allella commented Oct 25, 2019

@QuincyLarson @erictleung at least as a starting point, it might help to know FCC's experience and suggestion on browser support. @nik-john posted various stats above. The audiences of FCC and Chapter could well be different, but please share anything you feel is relevant to this browser support topic as CSS framework, or not, and a number of other #114 decisions will hinge on the supported browsers.

@kognise kognise mentioned this issue Oct 25, 2019
7 tasks
@ceciliaconsta3
Copy link
Contributor

ceciliaconsta3 commented Oct 25, 2019

Short Story: For the sake of simplicity, I say we draw a hard line in the sand and aim to at least support all major and latest browsers in the MVP. We can definitely circle back as many times as needed once more data is collected after MVP ships.

Reasons: If the three mentioned above could somehow find data on FCC users alone (i.e. only 2% of users use IPads, etc.) or find current official browser support, we have something more specific to work with.
It's true, the audiences between the two platforms may diverge and many FCC users may be using outdated/no longer supported browsers, but we do have time to optimize going forward. There are also security risks and fallbacks/shims/polyfills rabbit holes in CSS/frameworks/packages to using certain older browsers we may not want* to deal with immediately. If we are strictly speaking accessibility, older browsers just don't have the awareness and features of their newer counterparts.

@allella
Copy link
Contributor

allella commented Oct 26, 2019

Looks like IE10 is end of life on Jan 31 2020. https://support.microsoft.com/en-us/help/17454/lifecycle-faq-internet-explorer

@vkWeb
Copy link
Member

vkWeb commented Oct 26, 2019

@ceciliaconsta3 Spot on. You have nailed it. ;)

Fun fact: freeCodeCamp wasn't used to work well on firefox until late last year. Recent changes have made it more browser friendly. Imagine such a large learning platform wasn't use to work well on firefox.

So let's just support all modern browsers. By modern browsers, we mean browsers that regularly update their codebase to implement the latest standards: Chrome, Firefox, Safari. With time we can improve browser support from the community's feedback.

Internet Explorer support not required in 2019. And don't care about opera, it uses chromium under the hood. Edge uses chakra but soon Microsoft will migrate it to chromium.

@nik-john You are one of the lead devs in our team. Let's focus on building the MVP :)

@vkWeb
Copy link
Member

vkWeb commented Oct 26, 2019

@nik-john If you are satisfied with our consensus please close this issue otherwise I would welcome your feedback on this :)

@nik-john
Copy link
Contributor Author

Looks like IE10 is end of life on Jan 31 2020. https://support.microsoft.com/en-us/help/17454/lifecycle-faq-internet-explorer

Oh yes that's the case but that unfortunately wouldn't rid the world of the evil as it's already so widely used (but the numbers are going down lately) and people cannot/may not upgrade or migrate depending on the situation.

And don't care about opera, it uses chromium under the hood.

I strongly disagree. And to clarify, I don't mean Opera (most modern web apps will render fine on Opera). Like I've mentioned above, it's Opera Mini that we should provide at least a basic experience on. The red Here is Opera Mini. Having worked extensively on products aimed at African and South Asian markets, I can guarantee (as you can see from the data) that we will be shutting out hundreds of thousands of we don't keep this as an priority.

Browser support for FCC is really apples to oranges here because Chapter isn't as complex and doesn't require cutting edge features as much as it needs baseline support on all devices.

So let's just support all modern browsers. By modern browsers, we mean browsers that regularly update their codebase to implement the latest standards: Chrome, Firefox, Safari. With time we can improve browser support from the community's feedback.

That seems to be a good starting point. I'm putting down Chrome, FF, Safari (-2), IE-10+ support for all critical functionality and have any progressively enhanced features be aimed to work at least on the first 3. I'll make it a note to include this as a priority in my coding and code reviews, and would appreciate the same from everyone else 🙂

I'm flying in an hour but will add this to the Readme sometime today

@vaibhavsingh97
Copy link
Member

And don't care about opera, it uses chromium under the hood.

I also disagree, we will be lefting out thousands of people who are not using the latest browser. Also, FCC is quite a complex application, and support to a wide variety of browsers is quite difficult. There is a reason they haven't supported firefox, as they want to make application stable before releasing it to everyone but this doesn't mean they haven't supported firefox, people are able to use FCC, but not every feature FCC provides. Also, I do agree with @nik-john to support all browsers like chrome, firefox, safari, IE, etc.

image

By excluding Opera and Opera Mini, we are excluding these 28 % of Africans. Also, IMO before concluding to Browser support, should be first clear enough about our audience.

@QuincyLarson
Copy link
Contributor

As @vaibhavsingh97 pointed out, the front end of freeCodeCamp's curriculum - which only supports the latest few versions of Chrome and Firefox - is more complicated than the front end of Chapter will be.

The target audience of freeCodeCamp is developers, and it's more reasonable for us to tell these developers "go download a new browser." It would be harder to communicate this to less technical members of other organizations.

If it isn't much additional work, I am in favor of supporting more browsers. But only if it isn't much more work.

@QuincyLarson
Copy link
Contributor

For the sake of expediency, I am now recommending we just focus on Chrome, Firefox, and Safari for our MVP. This will cover 80% of desktop and mobile users.

We can later refine our front end to be compatible with Yandex, Opera, and other long-tail browsers.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

6 participants