[wp-trac] [WordPress Trac] #12641: Move JavaScript to the bottom of the page in TwentyTen theme

[WordPress Trac]

#12641: Move JavaScript to the bottom of the page in TwentyTen theme
-------------------------+--------------------------------------------------
 Reporter:  josephscott  |       Owner:           
     Type:  enhancement  |      Status:  new      
 Priority:  normal       |   Milestone:  3.0      
Component:  Themes       |     Version:  3.0      
 Severity:  normal       |    Keywords:  has-patch
-------------------------+--------------------------------------------------
 The general rule for browser performance is to load JavaScript as late in
 the page as possible.  The TwentyTen theme makes use of the comment-reply
 JavaScript code that comes with WordPress, and includes in the header.
 From what I can tell there's no need to include it in the header, since it
 deals with the comment reply form, generally at the bottom of the page.

 So I did some tests.  I removed the

 {{{ <?php if ( is_singular() ) wp_enqueue_script( 'comment-reply' ); ?>
 }}}

 in header.php and replaced it with

 {{{ <?php if ( is_singular() ) wp_print_scripts( 'comment-reply' ); ?> }}}

 at the very bottom of footer.php, just after the wp_footer() call and
 before the closing BODY and HTML tags.  The idea being to allow browsers
 to load the comment-reply JS as late as possible.

 I then used webpagetest.org to run load tests (IE8).  Here's the waterfall
 chart before my changes -
 http://www.webpagetest.org/result/100318_63M1/1/details/ - and after my
 changes - http://www.webpagetest.org/result/100318_63M3/1/details/

 You'll notice that the after chart has more parallel downloads of page
 resources.  Specifically in the before chart all other downloads are
 blocking until it finished getting comment-reply.js.

 I also looked at the charts in Chrome (resource inspector) and Firefox
 (firebug), both show similar results, with more parallel downloads
 happening with comment-reply JS moved to footer.php.

 I haven't seen any downsides to this move so far.  If this breaks
 something or causes other problems let's see what we can do to deal with
 them.  In the mean time I'm including a simple patch to make this change.

-- 
Ticket URL: <http://core.trac.wordpress.org/ticket/12641>
WordPress Trac <http://core.trac.wordpress.org/>
WordPress blogging software