Re: Web Performance Tips for Developers -- Any Suggestions?

This might be obvious, but i'm asking anyway.

Besides publishing such topics on WebPlatform.org, is there people among our networks who would write articles an/or aggregate such content and examples?  I'm talking, of course, of a broader scope than only performance here but "the right way".

I'm not involved in a WG yet and it feels that my on-the-field experience might be useful in contributing on those topics.

Could we make this happen?
--
Renoir Boulanger | Developer operations engineer
W3C | webplatform.org

http://w3.org/people/#renoirb  ✪  https://renoirboulanger.com  ✪  @renoirb
~

On April 30, 2014 2:00:01 PM EDT, Xiaoqian Cindy Wu <xiaoqian@w3.org> wrote:
>Hi All,
>
>I'm writing a note about Web Performance Tips, which aims to refine and
>increase the current guidelines and help the developers to improve
>their
>web performance by testing and some other pratical means.
>
>Here's a table of contents based on tricks I found from the current
>rules provided by Google[1], Yahoo[2] and some other blogers[3][4].
>Many
>thanks to these articles.
>
>I'm sure there are a lot of other methods that make the web faster and
>better, e.g. Resource Priorities in the WG, so, it would be nice to
>have
>your comments or suggestion here.
>
>-------------------------------------------------------
>*
>**1 Start from Server*
>1.1 Reduce TCP Connection by Keep-alive
>1.2 Fix Latency Problems with a CDN
>1.3 Configure Entity Tags
>1.4 Set an Expires or Cache Control Headers
>1.5 Compress Files in Gzip
>1.6 Process Parallely (BigPipe)
>
>*2 Try the Tricks in Content*
>2.1 Reduce HTTP Request by Combining Files or Image Sprites
>2.2 Avoiding Redirects
>2.3 Structure the HTML to Prioritize Critical Content
>2.4 Post-load the Not Absolutely Required Content
>2.5 Take Advantage of Pre-loading
>2.6 Keep Your DOM Simple
>2.7 Minify Resources by Compressing
>2.8 Use LocalStorage
>2.9 Choose the Right Format for Images
>
>*3 Optimize Scripts and CSS*
>3.1 Inline Small CSS and Javascript Resources
>3.2 Put Stylesheets at the Top and Scripts at the Bottom
>3.3 Avoid CSS Expressions and Filters
>3.4 Try Defer Loading of Javascript
>3.5 Be Cautious to DOM Access
>
>*4 Paint faster*
>4.1 Take Advantage of HTML5 New Elements and CSS3 New Features
>4.2 Avoid Plugins
>4.3 Avoid Scaling Images in HTML
>4.4 Make Sure Font Size is Valid
>*
>**5 Think about Mobile*
>5.1 What's Different? -- Slower Network, Smaller Cache, Unsatisfactory
>Browser Processing
>5.2 Cache as Much as Possible
>5.3 Use HTML5 Web Workers to Enable Multi-threading
>5.4 Use Server-sent Events
>5.4 Include a Meta Viewport
>5.5 Size Content to Different Vierports
>5.6 Size Tap Targets Properly
>5.7 Try Responsively-sized Images
>5.8 Consider Using Acceleration Hardware
>5.9 Support new Protocals (HTTP2)
>
>*6 Test Often*
>6.1 Measure all the Optimization by Testing
>6.2 Analyze the Waterfall Chart
>6.3 Discover Where are the Bottlenecks
>
>------------------------------------------------------------------
>
>[1] https://developers.google.com/speed/docs/insights/rules
>[2] http://developer.yahoo.com/performance/rules.html
>[3] http://cubiq.org/performance-tricks-for-mobile-web-development
>[4]
>http://www.speedawarenessmonth.com/15-things-for-making-your-site-faster-for-mobile-users/
>
>-- 
>Best Regards,
>Xiaoqian (Cindy) Wu