Everything about Web and Network Monitoring

Empty Src and Href Attributes

Website Performance: Taxonomy of Tips intro­duced a clas­si­fi­ca­tion scheme to help us or­ga­nize the many per­for­mance tips found on the In­ter­net.  Since Yahoo’s five most highly-weighted tips fall in­to the jour­ney from the ser­ver to the cli­entca­te­go­ry, we might ex­pect this ca­te­go­ry to of­fer the best im­prove­ment in web ap­pli­ca­tion per­for­mance.  This and my next two ar­ti­cles will dis­cuss tips that re­late to the jour­ney from the ser­ver to the cli­ent.It isn’t hard to find tips in this ca­te­go­ry.  In fact, if we li­mit our search to just those tips iden­ti­fied as “best practices” by Google, Yahoo, Steve Souders, and Patrick Killelea, this ca­te­go­ry is well rep­re­sent­ed.Today’s ar­ti­cle de­scribes the one tip that Yahoo con­si­ders most im­por­tant.

Avoid Empty src and href Attributes

These five code sam­ples:

     <img src=""> (HTML)
     <script src=""> (HTML)
     <link href=""> (HTML)
     var img = new Image(); img.src = ""; (JavaScript)
     style="background-image:url();" (CSS)

all have one thing in com­mon:  The URL spe­ci­fi­ca­tions are miss­ing.  Some brow­sers are better than others at hand­ling this, but some issue an ad­di­tion­al, un­ne­ces­sar­y re­quest to the ser­ver.  This causes the ser­ver to re­ge­ne­rate and re-serve the en­tire page a se­cond time for no rea­son.  If the web page al­ready has a large num­ber of hits, we are cre­at­ing an un­ac­cep­ta­ble load.

Let’s not blame the brow­sers, though.  They are sim­ply fol­low­ing RFC 3986, which says that a null URI is a va­lid URI.  HTML’s pre-2010 stan­dards al­so al­low null URL’s, so this code is not in­cor­rect.

Writing Better Code Isn’t Enough

From the co­der’s view­point, re­solv­ing this prob­lem is not as sim­ple as avoid­ing the above cod­ing pat­terns.  Good de­ve­lo­pers may find them­selves creat­ing this prob­lem un­know­ing­ly by using tem­plat­ing en­gines or con­tent ma­nage­ment sys­tems.  If the sys­tem we use cre­ates poor code, there’s not much we can do about it.  The cre­a­tors of those sys­tems must make the ne­ces­sary changes.  Even if we know the prob­lem ex­ists, trac­ing it back to its cause can be dif­fi­cult.

Detecting the Problem Through Monitoring

Nicholas Zakas ad­vises that these prob­lems can be de­tect­ed by watch­ing for a page that is its own re­fer­er.  This is an ap­pro­pri­ate task for a Monitis mo­ni­tor.  It can iden­ti­fy that the prob­lem ex­ists and tell us where to find it in our code.

The Future

As of March 2010, HTML5 eli­mi­nates this prob­lem, but until HTML5 is ful­ly im­ple­ment­ed by all brow­sers, IT ma­na­gers need to make sure their pro­jects care­ful­ly avoid emp­ty src and hrefat­tri­butes.  Sub­stan­tial ad­her­ence to the HTML5 stan­dard is still years away.

References

Best Practices for Speeding Up Your Web Site by Yahoo’s Exceptional Performance Team.  Published by Yahoo at developer.yahoo.com/performance/rules.html.  Accessed 2011.11.30.

Empty Image src Can Destroy Your Site by Nicholas C. Zakas.  Published 2009.11.30 by NCZ Online at www.nczonline.net/blog/2009/11/30/empty-image-src-can-destroy-your-site.  Accessed 2011.12.12.

Empty-String URLs in HTML – A Followup by Nicholas C. Zakas.  Published 2010.03.16 by NCZ Online at www.nczonline.net/blog/2010/03/16/empty-string-urls-in-html-a-followup.  Accessed 2011.12.12.

High Performance Web Sites – 14 Rules for Faster-Loading Web Sites by Steve Souders.  Published by Steve Souders at SteveSouders.com/hpws/rules.php.  Accessed 2011.11.30.

HTML5 – A Vocabulary and Associated APIs for HTML and XHTML.  Published 2011.12.09 by the World-Wide Web Consortium at dev.w3.org/html5/spec.  Accessed 2011.12.12.

Top Ten Web Performance Tuning Tips by Patrick Killelea.  Published 2002.06.27 by O’Reilly at OReilly.com/pub/a/javascript/2002/06/27/web_tuning.html.  Accessed 2011.11.30.

Web Performance Best Practices.  Published by Google at code.google.com/speed/page-speed/docs/rules_intro.html.  Accessed 2011.11.30.

Website Performance: Taxonomy of Tips by Warren Gaebel.  Published 2011.12.29 by Monitis at blog.mon.itor.us/2011/12/website-performance-taxonomy-of-tips.  Accessed 2012.01.02

Try Monitis For Free.  A 15-day free trial.  Your opportunity to see how easy it is to use the Monitis cloud-based monitoring system.  Credit card not required.

The Monitis Exchange at GitHub.  This is the official repository for scripts, plugins, and SDKs that make it a breeze to use the Monitis system to its full potential.

About Warren Gaebel

Warren wrote his first computer program in 1970 (yes, it was Fortran).  He earned his Bachelor of Arts degree from the University of Waterloo and his Bachelor of Computer Science degree at the University of Windsor.  After a few years at IBM, he worked on a Master of Mathematics (Computer Science) degree at the University of Waterloo.  He decided to stay home to take care of his newborn son rather than complete that degree.  That decision cost him his career, but he would gladly make the same decision again. Warren is now retired, but he finds it hard to do nothing, so he writes web performance articles for the Monitor.Us blog.  Life is good!

Web & Cloud
Monitoring