ExtJS - Page Analyzer

Main page

What is Page Analyzer?

Page Analyzer is a new tool, available as part of ExtJS 4.1. Measurement is key when it comes to improving the performance of your applications. You need to figure out what to measure and how to measure it so you can identify bottlenecks in your code and take the right steps to eliminate them. Page Analyzer helps you do that. Page Analyzer loads Ext JS 4.1 pages and instruments them with diagnostic hooks. The Page Analyzer contains many experimental features, but perhaps the most useful for optimizing application performance is the Layout tab.

Where can I find Page Analyzer?

You can find the tool in the Ext JS 4.1 Examples folder, at the following location in the SDK:


What do I need to do to use Page Analyzer?

Copy the entire “page-analyzer” folder on the server that also hosts the application you want to analyze. Be sure the version of Page Analyzer you use matches the build number of Ext JS, since it won’t work if you’re using a different build.

To use page analyzer:

  1. Open a browser and enter the URL for Page Analyzer ( /sdk/extjs/examples/grid/paging.html ).
  2. Provide the address of page you want to test, and click on the Load button. Page Analyzer is a web application. It has an address bar of its own. This field for the URL and the Load button are located at the top portion of the screen.
  3. The page that you want to analyze is loaded in an iframe.
  4. Click the various tabs within Page Analyzer. Hopefully, the data that is gathered and presented within each tab is intuitive enough. The Layout tab is like using the Performance tab within Microsoft Developer Tools.


Unless otherwise stated, the content of this page is licensed under Creative Commons Attribution-ShareAlike 3.0 License