Menu
I'm trying to troubleshoot an issue with bad acceptance of custom html build-reports that require a very long time to load on googlechrome, whereas load time is much better on firefox.
imo there is nothing 'special' about the html file.
the reports are usually loaded with anchor suffix, so the browser should jump to the very end of the file (='summary section') when it's loaded.
I have put a couple of example files on a github repo => browser bongo test
601
Mozilla touts that its Firefox browser uses 30% less RAM than Chrome. RAM is essentially your computer's short-term memory where it stores apps you're using for quick access. For browsers, more RAM on your computer means you can have more browser tabs, add-ons, and extensions without your computer slowing down.
In terms of features, supports, add-ons/extensions, both are almost the same. But, when it comes to overall performance and memory utilization, Firefox is better.
According to our tests, Chrome gets to keep its rule as the most resource-intensive browser even when it comes to CPU consumption. So, Firefox is a better bet if you don't want to overburden your CPU.
Chrome uses up to 1.77x more memory than Firefox. If your computer is already low on memory, this can cause a significant slowdown. Using Firefox's latest version with multi-process can result in more available memory to run your favorite programs.
Turns out, you can have TO FEW JAVASCRIPT in your html :-/
If you take a closer look at the Chrome profiler tool, you realize the "initial rendering" of any page is really quick, often less than 100 msec, no matter if the requested page is a "big" or "small" html / plaintext file.
After the initial rendering, Chromium seems to prefer receiving small junks of data, performing a additional rendering after each and every junk/part of the full content it receives. - and that's what causes Chromium based browsers to be MUCH slower in processing large amounts of data.
You can easily bypass this weird "performance flaw" by rubbing a little JavaScript on it: Simply create a wrapper-page, which loads the actual content by performing a XMLHttpRequest request and updates the DOM only once. 1 initial + 1 rendering after the content is loaded and set into the dom = 2 renderings, instead of 100.000ish.
By using the following code, I've been able to get the load time of a 20 MB plaintext file from ~280 secs down to approx 4 seconds in Google Chrome, current version.
<body>
<div id="file-content">loading, please wait</div>
<script type="text/javascript">
function delayLoad(path, callback) {
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function () {
if (xhr.readyState == 4) {
if (xhr.status == 200) {
callback(xhr.responseText);
} else {
callback(null);
}
}
};
xhr.open("GET", path);
xhr.send();
}
function setFileContent(fileData) {
var element = document.getElementById('file-content');
if (!fileData) {
element.innerHTML = "error loading data";
return;
}
element.innerHTML = fileData;
}
delayLoad("bongo_files/bongo_20M.txt", setFileContent);
</script>
</body>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With