Our great sponsors
-
SurveyJS
Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.
The first way, using filter, actually performs better because browsers can use hardware acceleration. However, it's not supported in IE11. So, if your users use IE11, you might want to avoid using filter. Alternatively, some browsers offer compatibility through the use of prefixes like -webkit-animation instead of animation. Many projects these days use a form of Autoprefixer to automatically do this for you.
Whenever you're in doubt about what CSS to use, you could check which approach works best in all browsers. Test your solution in Safari or Internet Explorer, or use Caniuse to check if something is supported in all (or enough) browsers. If there is a clear difference, you'll have your answer.