Cross-browser compatibility for web-applications
Web applications are getting bigger and smarter, and they are 24/7 accessible which is a reason why many companies use them for business. But, if you are a user of one, or you are a web developer, probably you have had problems with cross-browser compatibility (application performance and design is not the same in different browsers). Luckily, every problem has its solution, and we are ready to share our experience.
We will explain how to make a web app which is supported by different browsers and give you some useful advice.
How the browser works and what is in the root of the problem?
There are different strategies for handling incompatibilities between browsers; Let’s explore the most common ones.
- Feature detection – write code which asks browser something like – do you know for this feature? In case that browser does not know feature, code which explains that feature is written.
- Browser sniffing – from request you can read the user-agent name and depend on that send different code. This is not good practice, because the user can send you wrong information by changing user-agent info in settings of the browser.
For example, arrow functions, async functions, block-scoped functions, classes can be compiled, but, array buffer, array.from, array.of, map, nuber.isNaN or Promise must be polyfilled.It would be great if all users use the latest version of browsers and more great would be if all users use the same browser ( at least from the perspective of the programmer), but that is not reality. What we advise is to investigate libraries and features which you use and check browser support for them. Test after implementing each part of your app, so you can easily find which feature makes problem with your app. When you find a course, apply some of the above-mentioned methods and make your app works.