You can spend as minimum as 0 in fixing safari cross browser compatibility issues. Once you figure out what are the major cross browser compatibility issues in Safari, how you can find them, and how you can solve them. You can fix them immediately.
So, you need to test on safari browser to find out the issues. You can use LambdaTest for finding out cross browser compatibility issues in all the latest and oldest versions of Safari and other browsers too!
Let’s get to what are the major cross browser compatibility safari issues and their reasons:
Unsupported CSS is the root cause for a lot of cross browser compatibility issues, same is the case with Safari too. The race for efficient styled content has led the developers to using the latest web technologies that sometimes lack the browser support. While it is advisable to aim for responsive design techniques to make styling flexible for multiple viewports, let us look for the features that lack support in the latest 11.1 version and which should be avoided.
CSSOM Scroll Behavior
It is a method for specifying scroll behavior for scrolling box, navigational scrolling specifically.
Web Animations API.
Lets you create animations that are run in browser and as well as inspect and manipulate animations created through declarative means like CSS.
If you use this to limit the CSS content to boost the website efficiency, then switch to alternate method.
CSS Touch- action property
It keeps in check the control filtering of gesture events, developer options to selective disabling of touch scrolling.
CSS Text alignment last
CSS Overscroll Behavior
CSS Motion Path
While Safari offers support to a wide range of ECMA 6 features like Geolocation API, and exclusively offers features like Tail Call optimisation which you can exploit efficiently, there are a few unsupported features.
Shared memory and atomic
Lookbehind assertions in the RegExp
Background sync API
You must be extremely careful while choosing the multimedia formats as Safari has issues with certain formats. Forget about Flash-plugins, below mentioned are a few of the formats that lack the Safari support.
Media Recorder API
Mediastream recording targets to provide simplistic approach deployed by developers to record media from the user input and instantly use them in web apps, rather than having to perform manual encoding operations over and over again.
Ogg Vorbis audio format
Vorbis is a free and open source, commonly used in the Ogg container.
Ogg/ Theora video format
Free lossy video compression format.
WebM video format
Multimedia format designed to provide a royalty-free, high-quality open video compression format for use with HTML5 video. WebM supports the video codec VP8 and VP9.
Another open codec by IETF, which incorporated SILK from Skype and CELT from Xiph.org, to serve higher sound quality and lower latency bit rate.
Transport Layer problems
Safari has issues with some of the Transport layer features consistently. We take a look at the features that to this date haven’t given due attention.
Safari seems to lack support for the upcoming version of the Transport Layer Security (TLS) Protocol which will remove the weaker elliptic curves and hash functions. Both Chrome and Firefox are ahead of the curve with stable versions supporting the TLS.
ChaCha20 cipher suites
A set of cipher suites in TLS protocol which use symmetric encryption, in addition Poly 1305 which is used for authentication is also not given due attention by Safari.
Some more important features that remain without support are as follows:
Resource Hints: Prefetch
This feature is used and supported by leading browsers, informs the browsers so as to which resources should be prefetched in order for them to load more quickly.
Observing and reacting to the changes occuring in the size of DOM.
Method of including and reusing HTML documents in other HTML documents.
Web MIDI API
The web MIDI API specification defines a means for web developers to enumerate, manipulate and access MIDI devices.
Public Key Pinning
Declare that a website’s HTTP certificate should only be treated as valid if the public key is contained in a specified list to prevent MITM attacks that use valid CA-issued certificates.
Web Authentication API
The Web Authentication API is an extension of the Credential Management API that enables strong authentication with public key cryptography, enabling password-less authentication or secure second-factor authentication without SMS texts.
Visualizing Layer in Web Inspector
The layers tab is an experiment feature for Web inspector and I must say it is quite helpful. On First look it may look similar to the Firefox’s Tilt however there is a difference as Layer tab gives a 3-D visualization of the inspected page’s compositing layer and informs how they are rendered whereas Tilt provides visual representation of DOM tree.
The 3-D representation of rendering has potential to eradicate a lot of performance issues, the feature has long term benefits of debugging.