Tags: speed

turbolinks/turbolinks: Turbolinks makes navigating your web application faster

I really, really like the approach that this JavaScript library is taking in treating Ajax as a progressive enhancement:

Turbolinks intercepts all clicks on a href links to the same domain. When you click an eligible link, Turbolinks prevents the browser from following it. Instead, Turbolinks changes the browser’s URL using the History API, requests the new page using XMLHttpRequest, and then renders the HTML response.

During rendering, Turbolinks replaces the current body element outright and merges the contents of the head element. The JavaScript window and document objects, and the HTML html element, persist from one rendering to the next.

Here’s the mustard it’s cutting:

It depends on the HTML5 History API and Window.requestAnimationFrame. In unsupported browsers, Turbolinks gracefully degrades to standard navigation.

This approach matches my own mental model for building on the web—I might try playing around with this on some of my projects.

A faster FT.com – Engine Room

A data-driven look at impact of performance:

The data suggests, both in terms of user experience and financial impact, that there are clear and highly valued benefits in making the site even faster.

Managing Mobile Performance Optimization – Smashing Magazine

Some solid sensible advice on optimising performance.

Building the UX London website by Charlotte Jackson

Charlotte talks through some of the techniques she used when she was building the site for this year’s UX London, with a particular emphasis on improving perceived performance.

More Responsive Tapping on iOS | WebKit

This solution to the mobile tap delay by the WebKit team sounds like what I was hoping for:

Putting touch-action: manipulation; on a clickable element makes WebKit consider touches that begin on the element only for the purposes of panning and pinching to zoom. This means WebKit does not consider double-tap gestures on the element, so single taps are dispatched immediately.

It would be nice to know whether this has been discussed with other browser makers or if it’s another proprietary addition.

Smaller, Faster Websites - - Bocoup

The transcript of a great talk by Wilto, focusing on responsive images, inlining critical CSS, and webfont loading.

When we present users with a slow website, a loading spinner, laggy webfonts—or tell them outright that they‘re not using a website the right way—we’re breaking the fourth wall. We’ve gone so far as to invent an arbitary line between “webapp” and “website” so we could justify these decisions to ourselves: “well, but, this is a web app. It… it has… JSON. The people that can’t use the thing I built? They don’t get a say.”

We, as an industry, have nearly decided that we’re doing a great job as long as we don’t count the cases where we’re doing a terrible job.

I Turned Off JavaScript for a Whole Week and It Was Glorious | WIRED

When someone’s web browsing experience can be so drastically improved by simply switching off JavaScript, you know it’s time for an intervention with web developers.

This is our fault. Client-side JavaScript gave us enormous power and we abused that power.

Performance Budget Calculator

A handy little for calculating your performance budget based on how long you want your page to take to load on a particular connection.

Performance update #2: Electric Boogaloo | Vox Product Blog

It’s really great to see the performance improvements being made by the Vox team. This is the one that I think will make the most difference:

Our Revenue Team is increasing focus on the impact our advertising has on user experience and overall performance. One of their biggest initiatives has been to change the way ads load from synchronous to asynchronous, which has been underway for several months and is nearing deployment.

Declaring performance bankruptcy | Vox Product Blog

It’s really good to see that Vox are taking measures to fix their atrocious performance problems. The Verge in particular is a case study in how not to serve up text and images on the web. There have been times in the past when I’ve wanted to link to an article there but then thought “I can’t in good conscience put a fellow human through that.”

Supercharging page load (100 Days of Google Dev) - YouTube

A straight-faced Jake talks us through the step-by-step iterations for turning a JavaScript-required web thang into a progressively enhanced zippy experience, supercharged with Service Worker.

The web is fast by default, let’s keep it fast | hiddedevries.nl

Apart from the best practices that can often be automated, there are many human decisions that have impact on page speed. A way to make page speed part of the conversation and optimising it part of a website’s requirement, is to set a performance budget.

Making a difference with performance by Jaime Caballero

This is a great blow-by-blow account of making an agency website perform better.

I love the side-by-side comparisons with other agencies, including Clearleft—the gauntlet has been thrown down!

Google’s experimental new “slow” label could revolutionize how we tackle web performance - Web Performance Today

It looks like Google is going to start explicitly labelling slow sites as such in their search results (much like they recently started explicitly labelling mobile-friendly sites). So far it’s limited to Google’s own properties but it could be expanded.

Personally, I think this is a fair move. If the speed of a site were used to rank sites differently, I think that might be going too far. But giving the user advanced knowledge and leaving the final decision up to them …that feels good.

Researching the Performance costs of JavaScript MVC Frameworks

The Filament Group run the numbers on how long it takes browsers to parse the JavaScript of popular MVC frameworks: Backbone, Angular, and Ember. The results—especially on mobile browsers—are not encouraging.

Performance Budget Metrics - TimKadlec.com

Some good practical advice from Tim on setting a performance budget.

Use rule-based metrics to make sure you haven’t overlooked simple optimizations.

Use quantity-based metrics as guides to help designers and developers make better decisions about what goes onto a page.

JS Parse and Execution Time - TimKadlec.com

Tim’s been running the numbers on how long it takes various browsers on various devices to parse JavaScript—in this case, jQuery. The time varies enormously depending on the device hardware.

Fast Enough - TimKadlec.com

Some sensible thinking from Tim on measuring performance gains.

Test your app under slow network speeds

Some handy tips for simulating slow network speeds on your machine.

Latency: The New Web Performance Bottleneck - igvita.com

This is just wonderful! It combines almost all of my recent obsessions into one unified post: website performance (particularly on mobile) and the locations of undersea cables. The interactive map is the icing on the cake.

How We Improved Page Speed By Cleaning CSS, HTML and Images | Dyn Blog

Some good practical advice on improving performance. This should all be familiar to you, but it’s always worth repeating.

Twitter Engineering: Improving performance on twitter.com

Well, well, well. It turns out that building your entire application, content’n’all, in JavaScript isn’t so good for performance.

Pingdom Tools

A handy performance testing tool from Pingdom, similar to Google’s offering.

First thing you should do to optimize your desktop site for mobile « Cloud Four

Jason reiterates Bruce’s rallying cry: Performance First!

If you could only do one thing to prepare your desktop site for mobile and had to choose between employing media queries to make it look good on a mobile device or optimizing the site for performance, you would be better served by making the desktop site blazingly fast.

Bruce Lawson’s personal site  : What Users Want from Mobile, and what we can re-learn from them

Bruce hammers home the importance of speed and performance on mobile (and frankly, everywhere).

So perhaps some of the time and effort put into media queries, viewports, avoiding scrolling, line length would actually be better employed reducing HTTP requests and optimising so that websites are perceived to render faster.

nathanford/pngy - GitHub

A script that attempts to detect connection speed (by requesting a test file three times in a row) in order to determine whether hi-res images should be requested or not.

SPEED SHOW

I like this ad-hoc approach to staging one-night-only internet art shows:

Hit an Internet-cafe, rent all computers they have and run a show on them for one night.

Post Web site loads too slowly - The Washington Post

Performance matters. Here, the Washington Post compares its own weak performance (hampered by ads and tracking shite) to the optimised experience of porn sites.

Page Speed Service Home

Performance shit just got real.

You can now sign up with Google to have your site pass every request through them and get your documents served up optimised.

Book of Speed

An online book about website performance by Stoyan Steganov, released into the public domain. Excellent!

Google Analytics Blog: Measure Page Load Time with Site Speed Analytics Report

Great news! Google Analytics now tracks page load times.

BLDGBLOG: Islands at the Speed of Light

Freaky stuff. If you’ve seen Kevin Slavin or James Bridle talking about the increase in property prices on Wall Street as the buildings get closer to the network hub …that’s nothing—these are the new centres of world power; places where the speed of light interferes least with the speed of transactions.

Page Speed Online

A supremely useful tool from Google for measuring performance.

HTTP Archive

This is wonderful stuff: a long-term project to track the performance of high-traffic sites over time: oodles of lovely data and some quite shocking stats.

Make Photoshop Faster

Two little tips courtesy of Dan.

Let's make the web faster - Google Code

A whole heap of optimisation techniques from Google for faster CSS, JavaScript, markup and PHP.

dog or higher: phone sex with mars - or why latency matters as well as bandwidth

Brian Suda has a theoretical solution to real-time interplanetary communication: "I get on my tachyon voip phone and make a call from mars to earth at 9:00am it takes 10 minutes to travel there, but the tachyons travel backwards (so i think) that would be