Web Metrics Framework

Recently Google Web Metrics report came across and inspired by my co-worker Stoyan Stefanov’s WTF – Web Testing Framework I decided to build my own ruleset for YSlow using these metrics to check how good or bad pages are compared to Top and All Sites averages.

Continue reading ‘Web Metrics Framework’ »

New posts about performance. Back and alive!

After a long period of no posts due to personal issues, I’m back now and alive!
This time with a new post on YDN – Yahoo! Developer Network – blog: Performance on Yahoo! Search for Earth Day.
In this post I describe the performance case study of Yahoo! Search Earth Day campaign.

During this long off-post period, besides my day job, I’ve been doing some experiments, developing some tools and brainstorming lots of ideas, mostly related to performance and JavaScript. I do have some post drafts and will be publishing them soon. Here are a few topics I’m covering along this year:

  • setTimeout minimum delay limit
  • Prefetching CSS images
  • Problems with gradients filters on IE links hover
  • Flipping page direction RTL/LTR easily – RTLzr a Firefox extension
  • JavaScript Interviews Exposed (series)
  • Lazy Enhancement
  • JavaScript video subtitle
  • JavaScript video timeline marks
  • Deleting a removed node from DOM

Stay tuned!

Finding prime numbers with Javascript

A few days ago I introduced a friend of mine Jorge Rocha to SPOJ an online judge system for user-submitted programs, one of the first problems that he tried was the Prime Generator it consisted in finding all primes in a given range of numbers, after some time and few different algorithms he asked me if I had any tips to help him, although he had the correct algorithm (Sieve of Eratosthenes) something was clearly missing, the solution wasn’t fast enough and I had no clue where to go from there, so as usual when a question like that comes up I resort to Mauro Persano… and obviously he knew the answer, he taught us how to apply a heuristic to the algorithm to help solve the problem and after doing so the code worked and the solution was approved.

Continue reading ‘Finding prime numbers with Javascript’ »

JavaScript Challenge Revisited: Lotto Number Generator in Chains

Matthias Reuter from United Coders proposed a JavaScript Challenge: A Lotto Number Generator which the rules follow:

Write a JavaScript function that generates random lotto numbers. This function has to return an array of six different numbers from 1 to 49 (including both) in ascending order. You may use features of ECMA-262 only, that means no Array.contains and stuff. You must not induce global variables.

The function has to look like this

var getRandomLottoNumbers = function () {
    // your implementation here
};

Minify your function using JSMin (level aggressive) and count the bytes between the outer curly braces.

Continue reading ‘JavaScript Challenge Revisited: Lotto Number Generator in Chains’ »

YUI 3 first release is out

I’m more than pleased to announce that the 3rd generation of YUI is finally out, I’ve been following closely the YUI project ever since I joined Yahoo! almost 4 years ago and since then the framework has evolved incredibly, the 3rd version announced today is a complete redesign, the framework became faster, lighter and easier to use, quoting Eric Miraglia: “One of the goals of the YUI 3 redesign was to make it easy to use without sacrificing power, performance and configurability.”

Go ahead and give it a try, the YUI Blog post is a good starting point YUI 3.0.0: First GA Release of YUI’s Next-Generation Codeline

Harnessing the juice out of Yahoo! Pipes

While working on my current project at Yahoo! I had the need to aggregate different search feeds, the requirement was to have a way to pass a param to the url like search=search_term, and this would be passed along to the the feeds and it would return results from all the feeds (obviously it had to be done in the front end only), I thought about adding more YQL requests to my app but I didn’t want to change the code since we were planning on having a re-factor of this part of the code, so super Yahoo! Pipes to the rescue, it was a really easy task and got more than I asked for, like filters and sorting… the example speaks for itself: pipe example you can clone it and play with it.

You can also check all the other cool examples created by Paul Donnelly http://pipes.yahoo.com/31337 or even check Pipes Blog for their latest updates.

Fast min/max in arrays

This morning while commuting to the office, reading JavaScript for Web Developers, I bumped into a question: how could I improve a well known algorithm that gets the smallest or the largest number in an array by using built-in Math methods such as Math.min and Math.max. For those not familiar with these methods, they return the smallest or the largest number respectively from a list of zero or more numbers passed as parameters, e.g.: Math.min(4,3,9,6) returns 3, Math.max(4,3,9,6) returns 9. I was wondering if calling such methods using apply and an Array as argument would work. I could hardly wait to get to the office to test it out on my Firebug console. I first tried:

Math.max.apply(Math, [4,8,3,5,1,2]);

And bingo! It works!

Continue reading ‘Fast min/max in arrays’ »

WebKit Page Cache

Performance on the web has always been a hot topic to talk about specially when you talk about page load, but you don’t see as often people talking about perceived load which is related to how fast the interface responds to the user interaction, in this area WebKit based browsers like Safari and Chrome from my point of view have always been ahead.

Continue reading ‘WebKit Page Cache’ »

String searching algorithms in JavaScript engines

I’ve just finished chapter 7: Writing Efficient JavaScript by Nicholas Zakas on Steve Souders‘ new book, Even Faster Web Sites, where he presents several string optimization techniques to improve JavaScript performance and wondered which algorithm does String.indexOf method implements on JavaScript engines (aka ECMAScript engines).
A few months ago I’ve asked this question to Yahoo! fellow Douglas Crockford and he said the ECMAScript standard does not require a specific algorithm, so it could vary with each browser. You can check that on section 15.5.4.7 of Standard ECMA-262. I decided then to download the most popular open-source JavaScript engines source codes and found mainly 3 algorithms:

Continue reading ‘String searching algorithms in JavaScript engines’ »

CSS color brightness contrast using JavaScript

Dealing with foreground/background color contrast can be a bit tricky specially when you are a not a color-theory savvy or when using CSS color names as listed by Douglas Crockford’s page.
The most common problem is when you have to place a label over a color you don’t know on beforehand, it can either be an arbitrary color chosen by the user or come from a random-color generator function and sometimes from a long list in a datasource. Usually you have to decide between labeling it in black or white. When a color is too bright, a black label over it might be the best choice but definitely won’t be good over a very dark color, it can be really hard to read it, a white label should work better.

Continue reading ‘CSS color brightness contrast using JavaScript’ »