Scripting YSlow and/or PageSpeed - performance

As I'm starting to do some front end engineering at work, I would like to properly quantify the speedup achieved.
I would like to be able to use an average value of, say, 50 page load times measured by YSlow or Google Page Speed. Obviously, I don't want to hit reload 50 times and write down the value.
Is there a FF plugin for that or will I have to write a Firebug extension myself? Or maybe there is a non-FF, command-line tool that does what I'm planning?

I recently did a talk about this at Google Test Automation Conference in Zurich for this.
Slides for it are here
And I did a blog post on my company site about it and that can be found here
We were able to use the YSlow Beacon and Selenium together to automate the entire process.
I hope that helps!

Also check out GTmetrix which can do PageSpeed and YSlow analysis from a variety of reasons and has a free API you can use to automate this.

Not sure if you use Grunt in your development workflow, but there is a great package avaible that allows for easy scripting - check it out:
https://www.npmjs.org/package/grunt-pagespeed
Once you run it, it will output the results as follows:
Or, if you prefer to write your own, the Google PageSpeed API is also quite easy to use. Check out this blog post for more information:
http://deanhume.com/home/blogpost/the-google-pagespeed-api-and-mvc-4/86

Related

client side performance testing

i wanted to test web based software where java script play significant role.i want to check the performance ,can anyone suggest good tool. also iwant to automate the same.
Note : iam using jmeter for performance testing now.
Check out Yslow in firefox
https://addons.mozilla.org/en-US/firefox/addon/yslow/
With Firebug, you can use
console.time("name");
console.timeEnd("name");
or
console.profile();
console.profileEnd();
around a specific block of JS
I guess you could write a firebug plugin to somewhat automate it but it's more for looking for specific things.

monitor traffic to and from my pc

I want to see each url request made my by browser.
I want to see the url requests made by ajax.
Which software should I use? Some java code would also help.
You can use Fiddler or if you need to "go deep" (as their web page says), you can use Wireshark.
Firefox has a great plugin called LiveHTTPHeaders that I think will get you what you are looking for. I'm not positive on the AJAX part of the question, but it's worth a shot. I consider LiveHTTPHeaders to be an indispensable tool for anyone doing web development.
Use Firebug
(source: getfirebug.com)
Otherwise use Wireshark http://www.wireshark.org/ if you want the swiss army knife of network capture tools.
There are lots of great programs out there that will do this. My answer would really depend on what you are trying to do.
Adding an HTTP proxy that logs requests will easily do the job.
You can also leverage browser plugins such as FireBug and Google's Page Speed to see the requests fly in realtime.
Jacob
I don't really understand where do you want to see the traffic. But if what you mean is browser and if you are using Firefox then Firebug will come handy.
So many great extensions for Firefox that'll give you that info:
Firebug
PageSpeed
LiveHTTPHeaders
You could also try using the developer tools in Safari or Chrome if you're not a Firefox fan.
If you use IE... why are you using IE? ;-)
Any personal proxy will do. Fiddler was already suggested.
For Firefox I would use the TamperData plugin.

How to Programmatically take Snapshot of Crawled Webpages (in Ruby)?

What is the best solution to programmatically take a snapshot of a webpage?
The situation is this: I would like to crawl a bunch of webpages and take thumbnail snapshots of them periodically, say once every few months, without having to manually go to each one. I would also like to be able to take jpg/png snapshots of websites that might be completely Flash/Flex, so I'd have to wait until it loaded to take the snapshot somehow.
It would be nice if there was no limit to the number of thumbnails I could generate (within reason, say 1000 per day).
Any ideas how to do this in Ruby? Seems pretty tough.
Browsers to do this in: Safari or Firefox, preferably Safari.
Thanks so much.
This really depends on your operating system. What you need is a way to hook into a web browser and save that to an image.
If you are on a Mac - I would imagine your best bet would be to use MacRuby (or RubyCocoa - although I believe this is going to be deprecated in the near future) and then to use the WebKit framework to load the page and render it as an image.
This is definitely possible, for inspiration you may wish to look at the Paparazzi! and webkit2png projects.
Another option, which isn't dependent on the OS, might be to use the BrowserShots API.
There is no built in library in Ruby for rendering a web page.
Using Selenium & Ruby is one possibility. You can run Firefox as a headless browser (ie on a server).
Here is the source code for browser shots. http://sourceforge.net/projects/browsershots/files/
If you are using Linux you could use http://khtml2png.sourceforge.net/ and script it via Ruby.
Some paid services to try and automate
http://webthumb.bluga.net/home
http://www.thumbalizr.com
as viewed by.... ie? firefox? opera? one of the myriad webkit engines?
if only it were possible to automate http://browsershots.org :)
Use selenium-rc, it comes with snapshot capabilities.
With jruby you can use SWT's browser library.

How can I check my AJAX for browser capable?

I always have to check each and every browser to see if my website would work. Is there a website where I can check it with?
Update:
I don't really want just screenshots (which what browsershots do), I want to actually test the posting of my script.
You want a web site to check your web site for javascript compatibility? How would you expect it to know how to exercise your interface to trigger the proper interactions? Or are you thinking of it doing some sort of static code analysis? I think you are better off coding against a framework that has solved most of the browser-dependent idiosyncrasies and using it to check for browser capabilities before you use them. jQuery, MooTools, Prototype/Scriptaculous, etc. go a long way in solving these problems for javascript.
Note that you still need to worry about rendering your site, but you already have several answers for how to go about doing that based on web sites. Personally, I just maintain IE/Safari/FF/Opera/Chrome on my workstation and do significant checking in IE/FF and basic checking in Safari/Opera/Chrome.
Even when there exist websites that allow you to see a static snapshot of your site in several browsers, you should really test your page on them yourself, because there can be subtle, and not so subtle, bugs and differences that are only apparent when interacting with the webpage.
You can cover yourself quite a lot by testing in
A Gecko engine browser (Firefox)
A Webkit engine browser (Chrome, Safari, Konqueror)
Opera
AND IE6+
John Resig recommends checking the Yahoo graded browser support documentation.
If you write unit tests for your javascript, you could use testswarm http://testswarm.com
There are multiple options:
http://ipinfo.info/netrenderer/
These site will let you run multiple browsers and version without installing. You only need to install a plugin
http://spoon.net/browsers/
There are plenty of sites, just Google/Bing for browser compatibility check.
http://browsershots.org/ is a good one.
Although most of them just take a snapshot of the site, you might have to do the manual check for things like menus and dynamic content.
BrowserShots might do what you want if you can tell by rendering a particular URL whether or not things will work as expected.
In light of your update, you could still use BrowserShots by creating a page which tests each of your scripts and renders 'pass' or 'fail' as its content depending on whether they work or not.
Failing that, Multiple IE is quite useful for running various versions of IE on one PC which can otherwise be problematic.

Website performance measurement

I need a tool to measure a website's performance that's free and does not require any changes to be made to the code (jsp asp pages). All help is appreciated.
For performance measurement I recommend you YSlow, it's a Firefox add-on integrated with Firebug, it analyzes your web pages and tells you why they're slow based on the rules for high performance web sites.
Screenshot
Also with the Firebug Network Monitoring tab, you can see which resources are taking more time and bandwidth to download:
(source: getfirebug.com)
You could also use Fiddler which will work for browsers other than Firefox. (But will not profile javascript code)
See this post
The other answers to this question focus on performance of a single user of the site from their browser's point of view. If you want to test the performance of your server, for example, to see how many concurrent users you can support, you need to be looking at tools like JMeter.

Resources