Copy, paste, but don’t block the rendering!
It’s almost impossible to find a website that doesn’t utilize any kind of embedded widgets such as ads, social plugins, or analytics: All of these add-ons are considered 3rd party scripts and promise to increase and benefit publisher’s revenue. Publishers don’t have much control over the provider’s code and inevitably just have to trust their integrity, content security policy, code quality, and performance.
Imagine a high-traffic website hosting a twitter widget: Are publishers aware that a sudden twitter server outage could potentially bring down their site if the widget is not properly included?
The performance and availability of 3rd party scripts don’t have to become a threat or a nightmare for publishers. Barbara’s talk will not only outline best practices, tools, and tricks on how to sandbox 3rd party scripts, but also help the audience understand bottlenecks, determine potential risks, and elaborate on how to measure their performance.
Following this session, managers and developers will be equipped to ask the right questions when choosing 3rd party providers, while developers will be armed with guidelines on how to integrate 3rd party snippets efficiently into their deployment process without slowing down or even bringing down their site.
7. “In the strictest sense, anything served to the
client that’s provided by an organization that’s
not the website provider is considered to be
#velocityconf
third-party”
–Ben Vinegar, Author of “Third-Party Script”
8. #velocityconf
TYPES OF 3RD PARTY SCRIPTS
Advertising
Tracking and Analytics
Fonts
Social Media
Libraries and Frameworks
12. DISTRIBUTION OF 3RD PARTY SCRIPTS VS. 1ST PARTY
#velocityconf
31% 34.5% 38%
32%
36%
38%
2011 2013 2014
Source: http://bigqueri.es/t/what-is-the-distribution-of-1st-party-vs-3rd-party-resources/100
Percentage
23. #velocityconf
RULE OF THUMB
The value you get out of the widget needs to be
greater than the performance hit you are taking
value(widget) > perf_hit(widget)
- John Hjelmstad
Google I/O 2012 (How we Make JavaScript Widgets Scream)
24. #velocityconf
PERCEPTION OF PROMOTIONAL SPACE
A user who has to endure an 8-second download delay
spends only 1% of their total viewing time looking at the
featured promotional space on a landing page.
In contrast, a user who receives instantaneous page rendering
spends 20% of viewing time within the promotional area
(source: Jakob Nielsen)
76. #velocityconf
GOOGLE HOSTED LIBRARIES
Pages using Google CDN
(Top Alexa Websites)
0.4%
0.2%
0%
11%
17%
26%
37%
Jan '11 Jan '13 Jan '13 Jan '14
Percentage
97. WHAT TO DO AS A PUBLISHER & DEVELOPER
#velocityconf
• Refuse 3rd party content that doesn’t provide async options or is not minified
• Put the risk in the SLA (uptime etc.)
• Review jsmanners
• Educate other (junior) developers
• Test it via navigation and resource timing where applicable
98. WHAT TO DO AS A PUBLISHER & DEVELOPER
#velocityconf
• Ask for server-side options
• Evaluate tag managers
• Investigate hosted libraries (if no own CDN is available)
• Monitor, monitor, ….and monitor
• Evaluate the need of the script with marketing and sales
99. #velocityconf
WHAT TO DO AS A SCRIPT PROVIDER
• Provide non-blocking code samples and snippets
• Educate developers and verify the integration of your script (proof-check)