Polymer Loading Slow in FireFox - firefox

This is a very vague question, but I have noticed that Polymer (both version 1.0 and 2.0) are very slow to load in Mozilla FireFox when you have a large number of custom elements.
Does anyone know any high-level, general strategies for increasing the load time?
The page loads near instantly in Chrome, but can take up to 4 seconds in FireFox. I can see on the network tab that the resources are coming just as fast, but the in-browser render time is significantly slower.
Or even a method to test exactly what is taking a while to load in FireFox - that would be very helpful. Right now, I can see each network request, but not just browser processing.
Thanks in advance!
**edit: the elements are all minified and vulcanized into 1 file.

Try loading the webcomponents-lite.min.js instead of webcomponents.js this should give you way better Performance in FF

Try using the PRPL-pattern.
It's described here: https://developers.google.com/web/fundamentals/performance/prpl-pattern/
Or use the optimizations polymer build gives you:
https://www.polymer-project.org/2.0/docs/tools/polymer-cli

Related

How to measure DOM rendering time Angular 2 app?

While I am develping web application using Angular 2, I came to have question about performance test like how to measure loading time in Angular2?. Therefore, I got a very helpful answer, I could start to do performance test. However, I would like to measure DOM rendering time also. My app is very content intensive, the rendering time can be quite a while. If someone knows how to use benchmark.js in order to DOM rendering, could you give some advice?
Lighthouse is an excellent tool for measuring performance. It powers the "audit" tab in the chrome developer extensions, but can also be run from command-line if needed.

CKEDITOR at FireFox take a time to be loaded round 7 seconds i want to reduce this time

I am using Ckeditor. It Works fine on chrome but its taking too much time to load on Fire Fox take a time to be loaded round 7 seconds i want to reduce that time to be open quickly
Sounds like you need to profile your page. Meaning that you need to collect data on what specifically is taking so long to load and trying to improve those areas. Here is a nice Firefox profiling link. Here's a small checklist off the top of my dome that might help - always when doing changes, measure the impact they have on loading times using some kind of tool.
Check that FireFox (FF) is loading the minified version of CKEditor (cke)
Check that cache is being used - this helps with loadtimes greatly except for the first request
Benchmark cke performance for FF and Chrome using a barebones test to rule out your customizations and configuration.
This can help tons if you have a lot of custom code around cke like I do. I take a copy of my site, strip away my code, config, plugins, DOM elements etc until I find what is making the page load slowly. Or the other way around, start with nothing but a page with an editor and profile that against your site.
Disable all features and plugins you don't need
Make sure you use the latest version of cke and FF
Make sure you don't get any errors or bad looking warnings in the console
Check with a few different versions of FF and cke

IE takes too much time to load the page compared to Firefox

I have a page which displays around 1000 records.
The page gets loaded quite easily on firefox..around 2 seconds. But same on IE taking more that 10 seconds.
I checked performance tuning on server side, and modified the hibernate Criteria query returning this whole data. But issue is still there.
I also tried to remove almost all the plugins from IE thinking those could be the culprits. But no impact. :(
Trying to monitor the UI components on IE developer tool, but didnt find much details.
Any suggestions please. :)
Thanks in Advance :)
Performance issues like this will be down to rendering the UI. The server side processing won't vary from browser to browser, so it will be down to the way different browsers handle the drawing of the elements. Without seeing your page in action it is not easy to suggest anything to help improve your situation.
Guys Got the Culprit here... :) :)
After doing lot of RnD on Server side and Client side, I took a look at "Developer Tool" in IE.
You can find something like "Document Mode: Quirks". If you check the Wiki page for this Quirks mode, You can find a definition as "In computing, quirks mode refers to a technique used by some web browsers for the sake of maintaining backward compatibility with web pages designed for older browsers, instead of strictly complying with W3C and IETF standards in standards mode."
So this all becuase of checking for compatibility for all components on page. And hence the performance issue. :)
And When I changed this mode to IE 8 Standard. Things started working really well.
IE and its issues ...!!!! :D

What tools are available for analysing the time a browser spends processing a page

We are performance tuning our web site at the moment and have the main page content down to a respectable 65ms for firefox to grab it (from request to finish receiving the html).
Caching means there is generally no other content that needs to be requested from the server (after the initial page view).
However, firefox is spending another 400ms until onload fires. I assume this is the time it takes firefox to parse our html, fetch images, css and js from the cache, parse the css and js and render the page.
So, my question is, how can I drill into this 400ms of dead time and find out where most of it is being spent? eg. if I knew that css parsing was taking a long time, I could review that and turn it up as needed.
I don't really have any tools with enough sophistication for doing this. Any suggestions?
UPDATE: I know when the resources (like images etc) are loading. It is the other time, after the resources load I am trying to look at. YSlow don't help with this area.
Firebug with the YSlow add-on are great tools for seeing what resources are taking the longest to load.
In addition to firebug and yslow mentioned by Tim S Van Haren, there's also Page speed by google, also a firebug add-on.
Edit: Crockford recommends in his talks about javascript to use Dynatrace for IE, or the developers tools in chrome. Apparently, Firefox doesn't have the extensions for that level of precision yet, but it may have changed since the talk
And there's also this previous thread on Stackoverflow
You may want to give Fiddler a try. You can watch the HTTP traffic from several browsers and see a page's resources' load times.

GWT ScrollTable performance problem

I'm having a little performance problem with the gwt (incubator) ScrollTable. It's rendering really slow. Not even when I'm loading a lot of data - it happens already with a few rows.
Or is it possible that the deserializing of the data takes so long?
I'm using GWT 2.0 and IE.
Maybe someone has the same problem or a solution for it.
Thx and Happy Easter!
Please post your code - without it it's only possible to guess.
Nevertheless, you might try using Speed Tracer in Chrome (or Firebug in Firefox, though it doesn't have quite as detailed timing information) to see what's taking the time.

Resources