Skip to content

Update v5 .browserslistrc #41390

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
mdo opened this issue Apr 16, 2025 · 6 comments · May be fixed by #41404
Open

Update v5 .browserslistrc #41390

mdo opened this issue Apr 16, 2025 · 6 comments · May be fixed by #41404

Comments

@mdo
Copy link
Member

mdo commented Apr 16, 2025

v5 has been around for almost five years (with the first alpha release in June 2020). In that time, browser support for new CSS and JS features has really accelerated, and Bootstrap 5 hasn't progressed to support that.

I'd like to modify the supported browsers in v5.4 to push the project forward to more modern features.

Here's our list today with 96% coverage:

>= 0.5%
last 2 major versions
not dead
Chrome >= 60
Firefox >= 60
Firefox ESR
iOS >= 12
Safari >= 12
not Explorer <= 11
not kaios <= 2.5

Bumping some of these drops us to 94.4%:


>= 0.5%
last 2 major versions
not dead
**Chrome >= 105
**Firefox >= 121
Firefox ESR
**iOS >= 15.4
**Safari >= 15.4
not Explorer <= 11
not kaios <= 2.5

I targeted those versions to at least get :has(), but we may even want to further refine them and see what features we want access to without making folks upgrade to v6.

This in theory also goes well with the Sass modules support which will be a breaking change within v5.

More to come but I wanted to get this out there before I forgot and collect some initial thoughts.

@julien-deramond
Copy link
Member

To connect existing elements, the description in #37309 includes references related to a potential update of the .browserslistrc file.

@mdo
Copy link
Member Author

mdo commented Apr 18, 2025

Was looking at some compatibility tables and trying to find what features we'd want to see about adding support for in v5.x. Not exhaustive, but there are a handful if we jump to Safari 15.4-ish and Chrome 100-ish.

Feature Chrome Safari Firefox Likelihood
popover attribute 114 17 125 🔴
Custom 114 17 125 🔴
color-mix() 111 16.2 128 🟠
Relative colors 119 18 128 🔴 (Safari)
@container and container 105 16 110 🟠
@layer 99 15.4 97 🟢 (but unlikely for v5.x)
@property 85 16.4 128 🟠
:has() 105 15.4 121 🟢
Logical properties 89 15 137 🟢
Range media queries 104 18.4 137 🔴
37 15.4 98 🟢

@julien-deramond
Copy link
Member

The goal was to get a general sense of the ecological impact of supporting Safari 15 and above.

I started looking into this out of curiosity, since I never use Safari myself. But I’ve seen use cases where websites rendered poorly on otherwise perfectly functional Macs less than 10 years old, simply because the sites relied on features only available in more recent browser versions. That made me wonder how non-technical users might be impacted.

To make matters trickier, Safari versions are tied to macOS versions — and macOS updates are often locked out on older Macs. So even if the hardware is capable, users might be stuck with an outdated Safari.

Some features may still work thanks to fallbacks, so a proper assessment would require a feature-by-feature analysis.

Based on this early overview — if the findings hold up — Safari 15.4-ish might be a reasonable baseline to aim for.

Warning

This overview was generated by AI to give a general sense of the results — I haven’t manually verified it yet.

Apple Devices Stuck Below Safari 15

These devices are found by AI incompatible with Safari 15 or higher, due to OS limitations. By updating our .browserslistrc to Safari >= 15, these users would no longer be supported.

iPhones

Device Release Year Last OS Version Max Safari Version Notes
iPhone 5 2012 iOS 10.3.4 ~Safari 10 No 64-bit support
iPhone 5c 2013 iOS 10.3.3 ~Safari 10
iPhone 5s 2013 iOS 12.5.7 ~Safari 12 First 64-bit iPhone
iPhone 6 / 6 Plus 2014 iOS 12.5.7 ~Safari 12 No iOS 13 support

iPads

Device Release Year Last OS Version Max Safari Version Notes
iPad 4th Gen 2012 iOS 10.3.3 ~Safari 10
iPad mini 2 2013 iOS 12.5.7 ~Safari 12 Retina display
iPad mini 3 2014 iOS 12.5.7 ~Safari 12 Touch ID added
iPad Air (1st gen) 2013 iOS 12.5.7 ~Safari 12 No iPadOS support

Macs

Device Release Year Last macOS Version Max Safari Version Notes
MacBook Pro (13"/15") Mid-2012 macOS 10.15 Catalina Safari 14.1.2 No macOS 11 Big Sur
MacBook Air Mid-2012 macOS 10.15 Catalina Safari 14.1.2
MacBook Early 2015 macOS 11 Big Sur Safari 14.x Big Sur supported, but no Safari 15
iMac 2012 macOS 10.15 Catalina Safari 14.1.2
Mac mini 2012 macOS 10.15 Catalina Safari 14.1.2
Mac Pro (2010–2012) 2010–2012 macOS 10.14 Mojave* Safari 14.x Requires Metal GPU for Mojave

* Only supports Mojave if upgraded with a compatible GPU.


Safari 15+ Support Starts With:

Device Class Minimum Model Release Year
iPhone iPhone 6s / SE (1st) 2015
iPad iPad Air 2 / mini 4 2014–2015
Mac macOS 11 Big Sur-ready ~2013+

@mdo mdo linked a pull request Apr 23, 2025 that will close this issue
@louismaximepiton
Copy link
Member

On our project, we might define the same baseline as the ones in here. We had several discussions about it internally, but we've decided almost the same as yours:

>= 0.5%
last 2 major versions
not dead
Chrome >= 120
Firefox >= 121
Firefox ESR
iOS >= 15.6
Safari >= 15.6
not Explorer <= 11
Samsung >= 23

My main concerns go for:

  • Safari, we can set it to 15.6 so it won't break more than 15.4 and still have some newest features inside.
  • Samsung 23+ can be safely added I think with the baseline you define

Here is our findings about our .browserlistrc: Orange-OpenSource/Orange-Boosted-Bootstrap#2929

@mdo
Copy link
Member Author

mdo commented Apr 24, 2025

@louismaximepiton Wow amazing PR there with the supported features. Appreciate that! I think we'll end up going that route as well after reviewing your PR another time.

@coliff
Copy link
Contributor

coliff commented Apr 25, 2025

All looks good to me- happy to see the browser support updated!

One minor thing, not Explorer <= 11 can be completely removed from the config - it's not necessary to state that because a) it's browser marketshare is less than 0.5% so it wouldn't be included anyway, and b) it's also excluded as part of the not dead rule.

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

Successfully merging a pull request may close this issue.

4 participants