UPDATE (Apr 2014): My YouTube Tutorial on Web Performance Optimization with Dynatrace UEM
I recently analyzed FIFA’s World Cup website for web performance best practices and highlighted the top problems FIFA had on their website (too many flag images, very large favicon, et Cetera). After completing the post, I realized we could use a freely available trial service to run some tests to see if they have improved things. You can use this same process to test your own pages.
dynaTrace AJAX Edition has always been my tool of choice when doing these types of analysis blogs. Good news is that dynaTrace AJAX Edition 4.4 is soon to be released. Even better is that the full blown dynaTrace is now also available as a Free Trial including Browser, Java, .NET, PHP and Web Server Agents allowing you to do both Browser Diagnostics but also doing real end user monitoring. For both cases, the analysis doesn’t stop in the browser but can go full end-to-end (Browser to Database).
One of the cool things I like about dynaTrace vs dynaTrace AJAX Edition is the improved timeline which also shows captured screenshot:
I will keep this blog short – just to explain how to use the dynaTrace Free Trial to perform an even better analysis as you were able to do with dynaTrace AJAX Edition.
Step 1: Download Free Trial
It starts by going to Your Dynatrace Free Trial page. You can register your account. Why? Because you will automatically get full access to our Community which includes access to the Forums, Documentation, Videos, Downloads, … – Once you registered you will receive an email to confirm your email and activate your account. If you are an existing dynaTrace AJAX Edition user you can register using the same email address. After confirming the email you can use your previous username/pwd combination to logon to the community. If you dont remember your password simply go to “Forgot Password“.
Step 2: Installation including Browser Agents
The Browser agents are currently supported for Internet Explorer and Firefox on Windows. The dynaTrace End-to-End Agents (Java, .NET, Apache, IIS, PHP et. Cetera) are supported for all major platforms (Windows, Linux, Solaris, et. Cetera).
If you want to do browser diagnostics please make sure that during the installation process select “Custom” and check that the browser agent is selected as shown in the following screenshot:
Step 3: Browser Diagnostics
You can start by following the walkthroughs on the community: Diagnose Browser Activity or Browser Diagnostics. After installation of dynaTrace you simply click on “Add Tier” and select “Web Browser”. Then just follow that wizard where at the end you can click on Start Tracing WebBrowser enter a URL that will then automatically be launched in either IE or FF.
This is what I did with FIFA’s World Cup website, and then clicked through the Browser Performance Report that highlights the hotspots they have on their website:
Looking at the FIFA World Cup site it still seems that they haven’t changed the site after my initial analysis. They still have many images (e.g: individual country flags) as well as a very large favicon (370k) on that page which can be optimized.
Step 4: Going End-to-End
If you want to analyzer your own website, and not only analyze external pages like I did with FIFA, you can install agents on your JVMs, .NET CLRs, Apaches/IIS, PHP Engines, et.Cetera to get full end-to-end browser diagnostics and also end user monitoring visibility.
Here are two 5 minute videos that show how to do end-to-end with dynaTrace for Java & .NET:
For all other technologies (e.g: PHP, Other Web Applications, Mainframe, et. Cetera) have a look at our Quick Start Guides.
The next shows end-to-end for real users that try to access your website including everything from their browser (without needing to install a browser plugin) all the way through your backend implementation. More details on this screenshot and the story can be found in my recent blog post Deployment Gone Bad.
Now it’s up to you to optimize your own application performance!
Let us know what your findings are – whether it is on an external app or your own.