I. Overview
Browsers have a noticeable impact on report page display, and a browser’s response speed and recognizability of a new hypertext markup language (HTML) or a new webpage element have become a criterion for evaluating the browser.
In the light of the overall performance of different browsers and FineReport product architecture, the latest version of Chrome is recommended.
The table below outlines to what extent each of the major browsers supports FineReport functions:
Function | IE | Chrome | FireFox |
Basic functions | Supported by IE9 and later | Supported | Supported |
New data entry | Supported by IE10 and later | Supported | Supported |
Full screen | Supported by IE10 and later | Supported | Supported |
Expanded chart | Not supported | Supported | Not supported |
| You will Learn |
|---|
|
II. Reasons for recommendation
1. Testing and evaluation
The display of FineReport products relies on mainstream technologies such as JavaScript, CSS and Html5, and this article tests the performance of each browser through JetStream 2, MotionMark and Speedometer.
Tool | Test item | Description | Result analysis |
JetStream 2 | JavaScript and WebAssembly benchmarking | It focuses on state-of-the-art web apps. It measures the capabilities of a browser in terms of quick start, quick code execution and smooth running. | The higher the score, the better the performance |
MotionMark | Graphics benchmarking | It measures a browser’s capability of animation processing in complex scenes at the locked frame rate. | The higher the score, the better the performance |
Speedometer | Browser response speed benchmarking | It measures the speed of response to a Web app. It simulates user actions, e.g., adding backlog, using a demo Web app. | The higher the score, the better the performance |
2. Testing and evaluation data
Browser | Version | JetStream 2 | MotionMark | Speedometer |
Chrome | 81.0.4044.122 | 106.085 | 33.92±30.89% | 77.8±0.85 |
Edge (Chromium-based) | 81.0.416.64 | 105.253 | 16.45±109.47% | 77.1±2.9 |
Firefox | 75 | 60.913 | 19.27±34.59% | 66.2±4.8 |
IE | 11 | Disqualified | Disqualified | Disqualified |
3. Testing and evaluating results
Of the modern major browsers, Chrome is the best, closely followed by Edge, both of which are Blink core-based.
Firefox is inferior to Chrome and Edge in the JetStream 2 test, but almost on a par with the two in the other tests.
Failing all of the three tests, IE 11 is an old browser. In the real production environment, IE 11 lags far behind Chrome in terms of preview template and data entry.
III. Precautions for different browsers
1. IE browser
1）Compatibility View
IE Compatibility View allows Microsoft to be compatible with websites developed based on other web standards, so that users will not be plagued by disordered webpage display.
Once enabled, Compatibility View might cause IE browser to display in the low version mode, while FineReport templates are incompatible with IE8 and earlier, resulting in some styles being out-of-order or unavailable.
2）URL length limit
The max length of a URL that can be processed varies from browser to browser. In order for all users to browse normally, the length of a URL should not exceed 2,083 characters, the ceiling applicable to IE.
When customizing JavaScript in a template, if a function uses a URL concatenated with parameters, the max length limit should be considered.
Browser | Character limit |
IE | 2,083 |
FireFox | 65,536 |
Chrome | 8,182 |
2. FireFox browser
1) Request processing sequence
In processing requests, FireFox browser starts with asynchronous response data and then synchronous requests, while other browsers do the opposite.
In customizing JavaScript and using setVisible to set hidden display content, it will disrupt the original style to first load the content in a report block as asynchronous request data and then process hidden display. Therefore, when using the function, you can add a timer setTimeout(function(){},1) to address the difference in request processing sequence.
2) Printing settings
The print orientation of Firefox follows printer preferences, and the printer inherits the previous printing settings.
When calling zero-client printing through JavaScript, you can only call the printing functions provided by FireFox, rather than specifying the print orientation among printer preferences. To solve this, you may use a local printer.
Previous：An Introduction of FineReport
