Talk from Akamai Edge 2014 looking at some of our current web performance optimisation practices and how they may need to change as new standards and protocols emerge
This document discusses the importance of website speed and performance. It notes that most top retail sites take over 3 seconds to load critical content, and median page load times have slowed by 23% year-over-year. Faster sites see benefits like 10% higher conversions. Network latency has a greater impact on performance than bandwidth. Techniques like preloading fonts and images can help mitigate latency. Frameworks and features like service workers may also help if designed deliberately for performance. Regular measurement and setting performance budgets are recommended to build fast user experiences.
The Case for HTTP/2 - EpicFEL Sept 2015Andy Davies
HTTP/2 is here but why do we need it, and how is it different to HTTP/1.1?
Video - https://www.youtube.com/watch?v=ob-CnA9YmiI
These are the slides from my talk at Front-End London's one day conference, EpicFEL
The Case for HTTP/2 - Internetdagarna 2015 - StockholmAndy Davies
HTTP/2 is here but why do we need it, how is it different to HTTP/1.1 and what does the mean for developers?
Slides from my talk at Internetdagarna 2015, Stockholm
HTTP/2 addresses limitations in HTTP/1.x by multiplexing requests over a single TCP connection, compressing headers, and allowing servers to push responses. It leads to more efficient use of network resources and faster page loads. While browser support is good, server implementations are still maturing and need to fully support HTTP/2 features like streams, dependencies, and server push to provide optimizations. Efficient TLS is also important to avoid delays in taking advantage of HTTP/2 performance benefits.
Mobile Web Performance - Getting and Staying FastAndy Davies
Slides from mine and Aaaron Peter's talk at QCon London (Mar 2014) on how to measure mobile web performance, things that affect in and how to improve it
Talk from The Web Is in Cardiff, October 2014 exploring the business case for web performance, and some of the underlying factors that can make sites slow
This document discusses the importance of website speed and performance. It notes that most top retail sites take over 3 seconds to load critical content, and median page load times have slowed by 23% year-over-year. Faster sites see benefits like 10% higher conversions. Network latency has a greater impact on performance than bandwidth. Techniques like preloading fonts and images can help mitigate latency. Frameworks and features like service workers may also help if designed deliberately for performance. Regular measurement and setting performance budgets are recommended to build fast user experiences.
The Case for HTTP/2 - EpicFEL Sept 2015Andy Davies
HTTP/2 is here but why do we need it, and how is it different to HTTP/1.1?
Video - https://www.youtube.com/watch?v=ob-CnA9YmiI
These are the slides from my talk at Front-End London's one day conference, EpicFEL
The Case for HTTP/2 - Internetdagarna 2015 - StockholmAndy Davies
HTTP/2 is here but why do we need it, how is it different to HTTP/1.1 and what does the mean for developers?
Slides from my talk at Internetdagarna 2015, Stockholm
HTTP/2 addresses limitations in HTTP/1.x by multiplexing requests over a single TCP connection, compressing headers, and allowing servers to push responses. It leads to more efficient use of network resources and faster page loads. While browser support is good, server implementations are still maturing and need to fully support HTTP/2 features like streams, dependencies, and server push to provide optimizations. Efficient TLS is also important to avoid delays in taking advantage of HTTP/2 performance benefits.
Mobile Web Performance - Getting and Staying FastAndy Davies
Slides from mine and Aaaron Peter's talk at QCon London (Mar 2014) on how to measure mobile web performance, things that affect in and how to improve it
Talk from The Web Is in Cardiff, October 2014 exploring the business case for web performance, and some of the underlying factors that can make sites slow
WebPageTest is a great tool for testing and analysing how quickly web pages load.
Many people just use it as a simple testing tool, but it has advanced scripting capabilities for multi-page testing, completing forms etc.
It also has an API so performance testing can be integrated into Continuous Integration processes, used for monitoring and analysing how the web is built.
These slides explore some of these capabilities in more detail.
There are bonus slides after the "Thank You" slide
The Case for HTTP/2 - GreeceJS - June 2016Andy Davies
HTTP/2 is here but why do we need it, how is it different to HTTP/1.1 and what does the mean for developers?
Slides from my talk at GreeceJS in Athens, June 2016
Slides from my Ignite (20 slides, auto-advancing every 15 secs) talk at WebPerfDays, Mountain View.
Not sure they will make sense standalone but talk was recorded and will be available at some point.
Would also like to work this up into a longer talk at some point.
Are Today’s Good Practices… Tomorrow’s Performance Anti-Patterns?Andy Davies
This document discusses how performance best practices may become anti-patterns as technologies evolve. It explores how techniques like data URIs, domain sharding, and CSS sprites could be negatively impacted by new protocols like SPDY. The author advocates experimenting with modern tools like mod_pagespeed to test different optimizations under various conditions and sharing results. Continued improvement of debugging tools is also important to help evaluate new approaches as the network landscape changes. Overall, the message is that situational optimization will become more important over rigid rules as complexity increases.
Browser Wars Episode 1: The Phantom MenaceNicholas Zakas
This document summarizes the history and evolution of web browsers and internet technologies from the early 1990s to the late 1990s. It traces the development of key browsers like Netscape Navigator and Internet Explorer. It also outlines the introduction of important web standards like HTML, CSS, JavaScript and XML. Major events included the commercialization of the web in the mid-1990s, the browser wars between Netscape and Microsoft in the late 90s, and the consolidation of online services providers toward the end of the decade.
How I learned to stop worrying and love the .htaccess fileRoxana Stingu
An introduction to .htaccess and what this file can do to help with SEO.
Redirects:
- Mod_alias and mod_rewrite
- Most common redirect types (domain migrations, subdomain to folder and folder renaming and how to deal with duplicate content).
Indexing & Crawling:
- Set HTTP headers for canonicals and meta robots for non-HTML files.
Website speed:
- Gzip and Deflate
- Cache control
SearchLove San Diego 2018 | Tom Anthony | An Introduction to HTTP/2 & Service...Distilled
HTTP/2 and Service Works are becoming more established, yet the SEO community lacks awareness of what they are what they may mean for us. A lot of us know we need to know about them but we manage to keep putting it off. However, for both of these technologies, the next 12 months are going to be the turning point where we really can't avoid learning more about them. Tom will provide and accessible introduction to both, with a focus on what they are, how they work and what SEOs need to know. If you have been scared of jumping in to them until now, this session will help get you up to speed.
The document discusses improving page load performance on websites. It notes that many sites are currently too slow and outlines some strategies to minimize latency, round trips, and blocking of page loads. These include prioritizing important content in the first round trip, automating optimization processes, and measuring performance directly in the user's browser to better understand why pages are slow and how to fix those issues. The document emphasizes that performance is an important part of user experience that needs more consideration in website design.
As browsers explode with new capabilities and migrate onto devices users can be left wondering, “what’s taking so long?” Learn how HTML, CSS, JavaScript, and the web itself conspire against a fast-running application and simple tips to create a snappy interface that delight users instead of frustrating them.
The document discusses strategies for making mobile websites faster, including optimizing images, caching resources, minimizing redirects, leveraging new HTML elements like <picture>, compressing files, and ensuring smooth performance after page load. It emphasizes the importance of measuring site performance and adapting delivery based on network conditions and device capabilities.
Web Performance Workshop - Velocity London 2013Andy Davies
The document summarizes a hands-on web performance workshop. It discusses tools and techniques that will be covered, including live analysis of websites. Attendees are encouraged to ask questions and suggest sites to test. Various tools for performance testing like PhantomJS, Phantomas, and WebPageTest are introduced. The workshop also discusses integrating performance tests with TAP and Jenkins. Additional topics include processing performance data in R, looking at live sites, issues like unnecessary repainting, and lessons learned in web performance optimization.
As programmers, we concentrate so much on the server/backend side of things that we often forget to measure performance from the Client's viewpoint. This presentation describes a bunch of techniques that can be used to speed up our websites.
SearchLove San Diego 2018 | Mat Clayton | Site Speed for Digital MarketersDistilled
We all know that site speed matters not only for users but also for search rankings. As marketers, how can we measure and improve the impact of site speed? Mat will cover a range of topics and tools, from the basic quick wins to some of the more surprising and cutting-edge techniques used by the largest websites in the world.
In the beginning, progressive enhancement was simple: HTML layered with CSS layered with JavaScript. That worked fine when there were two browsers, but in today's world of multiple devices and multiple browsers, it's time for a progressive enhancement reboot. At the core is the understanding that the web is not print - the same rules don't apply. As developers and consumers we've been fooled into thinking about print paradigms for too long. In this talk, you'll learn just how different the web is and how the evolution of progressive enhancement can lead to better user experiences as well as happier developers and users.
This deck is a conference-agnostic one, suitable to be shown anywhere without site-specific jokes!
Web Developers are excited to use HTML 5 features but sometimes they need to explain to their non-technical boss what it is and how it can benefit the company. This presentation provides just enough information to share the capabilities of this new technologies without overwhelming the audience with the technical details.
"What is HTML5?" covers things you might have seen on other websites and wanted to add on your own website but you didn't know it was a feature of HTML 5. After viewing this slideshow you will probably give your web developer the "go ahead" to upgrade your current HTML 4 website to HTML 5.
You will also understand why web developers don't like IE (Internet Explorer) and why they always want you to keep your browser updated to latest version. "I have seen the future. It's in my browser" is the slogan used by many who have joined the HTML 5 revolution.
The document discusses ways to improve website performance by reducing page load times. It identifies several factors that affect performance like request size, response size, number of components, and bandwidth. It then provides recommendations to shrink the response size through compression and optimization, reduce the number of requests by merging files, and minimize third-party scripts when possible. Specific techniques mentioned include minifying assets, using content delivery networks, browser caching, and tools for testing and monitoring performance.
1. The document discusses speed and security as the active and passive components of a WordPress site. It provides tips to optimize speed through good hosting, CDNs, minification, and caching.
2. For security, it recommends prevention through regular backups, security plugins, and hardening measures. Common vulnerabilities include outdated plugins/themes and lack of security updates or measures.
3. Testing tools like GTmetrix and PageSpeed Insights can evaluate page speed, but their recommendations shouldn't always be followed. Ignoring site speed can lead to abandonment issues.
Andy Davies (Web Performance Expert @NCC Group, Author of Using WebPageTest - O'reilly) presents The case for HTTP/2 at GreeceJS meetup #14 (Athens, June 15, 2016)
WebPageTest is a great tool for testing and analysing how quickly web pages load.
Many people just use it as a simple testing tool, but it has advanced scripting capabilities for multi-page testing, completing forms etc.
It also has an API so performance testing can be integrated into Continuous Integration processes, used for monitoring and analysing how the web is built.
These slides explore some of these capabilities in more detail.
There are bonus slides after the "Thank You" slide
The Case for HTTP/2 - GreeceJS - June 2016Andy Davies
HTTP/2 is here but why do we need it, how is it different to HTTP/1.1 and what does the mean for developers?
Slides from my talk at GreeceJS in Athens, June 2016
Slides from my Ignite (20 slides, auto-advancing every 15 secs) talk at WebPerfDays, Mountain View.
Not sure they will make sense standalone but talk was recorded and will be available at some point.
Would also like to work this up into a longer talk at some point.
Are Today’s Good Practices… Tomorrow’s Performance Anti-Patterns?Andy Davies
This document discusses how performance best practices may become anti-patterns as technologies evolve. It explores how techniques like data URIs, domain sharding, and CSS sprites could be negatively impacted by new protocols like SPDY. The author advocates experimenting with modern tools like mod_pagespeed to test different optimizations under various conditions and sharing results. Continued improvement of debugging tools is also important to help evaluate new approaches as the network landscape changes. Overall, the message is that situational optimization will become more important over rigid rules as complexity increases.
Browser Wars Episode 1: The Phantom MenaceNicholas Zakas
This document summarizes the history and evolution of web browsers and internet technologies from the early 1990s to the late 1990s. It traces the development of key browsers like Netscape Navigator and Internet Explorer. It also outlines the introduction of important web standards like HTML, CSS, JavaScript and XML. Major events included the commercialization of the web in the mid-1990s, the browser wars between Netscape and Microsoft in the late 90s, and the consolidation of online services providers toward the end of the decade.
How I learned to stop worrying and love the .htaccess fileRoxana Stingu
An introduction to .htaccess and what this file can do to help with SEO.
Redirects:
- Mod_alias and mod_rewrite
- Most common redirect types (domain migrations, subdomain to folder and folder renaming and how to deal with duplicate content).
Indexing & Crawling:
- Set HTTP headers for canonicals and meta robots for non-HTML files.
Website speed:
- Gzip and Deflate
- Cache control
SearchLove San Diego 2018 | Tom Anthony | An Introduction to HTTP/2 & Service...Distilled
HTTP/2 and Service Works are becoming more established, yet the SEO community lacks awareness of what they are what they may mean for us. A lot of us know we need to know about them but we manage to keep putting it off. However, for both of these technologies, the next 12 months are going to be the turning point where we really can't avoid learning more about them. Tom will provide and accessible introduction to both, with a focus on what they are, how they work and what SEOs need to know. If you have been scared of jumping in to them until now, this session will help get you up to speed.
The document discusses improving page load performance on websites. It notes that many sites are currently too slow and outlines some strategies to minimize latency, round trips, and blocking of page loads. These include prioritizing important content in the first round trip, automating optimization processes, and measuring performance directly in the user's browser to better understand why pages are slow and how to fix those issues. The document emphasizes that performance is an important part of user experience that needs more consideration in website design.
As browsers explode with new capabilities and migrate onto devices users can be left wondering, “what’s taking so long?” Learn how HTML, CSS, JavaScript, and the web itself conspire against a fast-running application and simple tips to create a snappy interface that delight users instead of frustrating them.
The document discusses strategies for making mobile websites faster, including optimizing images, caching resources, minimizing redirects, leveraging new HTML elements like <picture>, compressing files, and ensuring smooth performance after page load. It emphasizes the importance of measuring site performance and adapting delivery based on network conditions and device capabilities.
Web Performance Workshop - Velocity London 2013Andy Davies
The document summarizes a hands-on web performance workshop. It discusses tools and techniques that will be covered, including live analysis of websites. Attendees are encouraged to ask questions and suggest sites to test. Various tools for performance testing like PhantomJS, Phantomas, and WebPageTest are introduced. The workshop also discusses integrating performance tests with TAP and Jenkins. Additional topics include processing performance data in R, looking at live sites, issues like unnecessary repainting, and lessons learned in web performance optimization.
As programmers, we concentrate so much on the server/backend side of things that we often forget to measure performance from the Client's viewpoint. This presentation describes a bunch of techniques that can be used to speed up our websites.
SearchLove San Diego 2018 | Mat Clayton | Site Speed for Digital MarketersDistilled
We all know that site speed matters not only for users but also for search rankings. As marketers, how can we measure and improve the impact of site speed? Mat will cover a range of topics and tools, from the basic quick wins to some of the more surprising and cutting-edge techniques used by the largest websites in the world.
In the beginning, progressive enhancement was simple: HTML layered with CSS layered with JavaScript. That worked fine when there were two browsers, but in today's world of multiple devices and multiple browsers, it's time for a progressive enhancement reboot. At the core is the understanding that the web is not print - the same rules don't apply. As developers and consumers we've been fooled into thinking about print paradigms for too long. In this talk, you'll learn just how different the web is and how the evolution of progressive enhancement can lead to better user experiences as well as happier developers and users.
This deck is a conference-agnostic one, suitable to be shown anywhere without site-specific jokes!
Web Developers are excited to use HTML 5 features but sometimes they need to explain to their non-technical boss what it is and how it can benefit the company. This presentation provides just enough information to share the capabilities of this new technologies without overwhelming the audience with the technical details.
"What is HTML5?" covers things you might have seen on other websites and wanted to add on your own website but you didn't know it was a feature of HTML 5. After viewing this slideshow you will probably give your web developer the "go ahead" to upgrade your current HTML 4 website to HTML 5.
You will also understand why web developers don't like IE (Internet Explorer) and why they always want you to keep your browser updated to latest version. "I have seen the future. It's in my browser" is the slogan used by many who have joined the HTML 5 revolution.
The document discusses ways to improve website performance by reducing page load times. It identifies several factors that affect performance like request size, response size, number of components, and bandwidth. It then provides recommendations to shrink the response size through compression and optimization, reduce the number of requests by merging files, and minimize third-party scripts when possible. Specific techniques mentioned include minifying assets, using content delivery networks, browser caching, and tools for testing and monitoring performance.
1. The document discusses speed and security as the active and passive components of a WordPress site. It provides tips to optimize speed through good hosting, CDNs, minification, and caching.
2. For security, it recommends prevention through regular backups, security plugins, and hardening measures. Common vulnerabilities include outdated plugins/themes and lack of security updates or measures.
3. Testing tools like GTmetrix and PageSpeed Insights can evaluate page speed, but their recommendations shouldn't always be followed. Ignoring site speed can lead to abandonment issues.
Andy Davies (Web Performance Expert @NCC Group, Author of Using WebPageTest - O'reilly) presents The case for HTTP/2 at GreeceJS meetup #14 (Athens, June 15, 2016)
The document discusses the importance of website performance and provides tips to build responsive websites. It notes that users expect pages to load within 2 seconds and will leave slow sites. The tips include reducing HTTP requests, gzipping and minifying components, optimizing images, delivering JavaScript and CSS efficiently, lazy loading images, and inlining critical CSS. Following these foundations and techniques can significantly improve load times and user experience.
Progressive downloads and rendering (Stoyan Stefanov)Ontico
This document discusses techniques for progressively downloading and rendering web pages to improve performance and user experience. It covers topics like preventing blocking JavaScript and CSS downloads, using techniques like deferred and async scripts, inline CSS, and flushing to start rendering sooner. It also discusses using data URIs to reduce HTTP requests by inlining images and other assets. Formats like MHTML and chunked encoding are presented as ways to progressively deliver content across browsers. The goal is to start outputting content as fast as possible while downloading remaining assets in the background.
Progressive Enhancement 2.0 (jQuery Conference SF Bay Area 2011)Nicholas Zakas
In the beginning, progressive enhancement was simple: HTML layered with CSS layered with JavaScript. That worked fine when there were two browsers, but in today's world of multiple devices and multiple browsers, it's time for a progressive enhancement reboot. At the core is the understanding that the web is not print - the same rules don't apply. As developers and consumers we've been fooled into thinking about print paradigms for too long. In this talk, you'll learn just how different the web is and how the evolution of progressive enhancement can lead to better user experiences as well as happier developers and users.
Web Components: The Future of Web Development is HereJohn Riviello
With the updates to iOS and Android phones released earlier this year, Web Components are now supported natively. With libraries such as Polymer that are built on top of Web Components, it is now possible to easily create fast Progressive Web Apps (PWAs) without the overhead of a framework. In this workshop, we'll begin with a brief introduction to Web Components and Polymer, and then dive into hands-on experiences with the core aspects of Web Components: the <template> tag, Custom Elements, and the Shadow DOM.
HTTP/2 is a new version of the HTTP network protocol that aims to improve website performance. It uses a single TCP connection to allow multiple requests and responses to be multiplexed together. This improves efficiency over HTTP/1.1. Additionally, HTTP/2 allows servers to push critical resources like CSS files to clients, potentially reducing load times. While HTTP/2 brings performance benefits, challenges remain around widespread server support and differing optimizations between HTTP/1.1 and HTTP/2.
Progressive downloads and rendering allow content to be delivered and displayed to the user incrementally to improve perceived performance. JavaScript should be placed at the bottom of the page to avoid blocking. CSS can block rendering so should also be delivered non-blocking when possible. Techniques like flushing output, non-blocking scripts, and data URIs can help deliver content progressively. MHTML and preloading can help optimize delivery across multiple HTTP requests. The overall goal is to start displaying content as soon as possible while content continues downloading in the background.
Web Directions South - Even Faster Web SitesSteve Souders
The document discusses techniques for optimizing web page performance, including loading scripts asynchronously without blocking page rendering, splitting scripts into critical and non-critical parts, leveraging content delivery networks, minimizing downloads, and using new web standards like the Navigation Timing API. It emphasizes the importance of front-end optimization and progressive enhancement to improve site speed. Examples are given of how major sites like Google, Facebook, and Wikipedia optimize script loading.
This document provides practical strategies for improving front-end performance of websites. It discusses specific techniques like making fewer HTTP requests by combining files, leveraging browser caching with far-future expires headers, gzipping components, using CSS sprites, and deploying assets on a content delivery network. It also summarizes key rules from tools like YSlow and PageSpeed for optimizing front-end performance.
It's Business Time: Givin' User Experience Love with CSS3Denise Jacobs
Advanced CSS and CSS3 can add richness to your site’s experience layer by enhancing interactivity. While the CSS3 specification as a whole is still in flux, but you can still use many CSS3 properties today. Regardless of the project, anyone can inject flexible techniques that enrich the interactions built into websites.
The document discusses optimizing frontend performance. It recommends reducing HTTP requests by combining CSS files into one file and using sprites and data URIs for images. It also suggests automating minification, compression, and image optimization. Performance should be monitored using tools like WebPagetest, YSlow, and PageSpeed. Frontend optimizations like these can reduce page load times and bandwidth usage.
The document summarizes key techniques for responsible responsive web design, including building mobile-first responsive designs, keeping CSS images in their place, conditionally loading JavaScript based on screen size and capabilities, delivering different sized images at different screen sizes, and handling high-density images carefully. It also discusses debates around whether a one-size-fits-all responsive approach can compete with a tailored experience and ensuring responsive designs are optimized for performance.
The document discusses optimization of the presentation tier of web applications. It notes that the presentation tier is often overlooked despite being responsible for over 30% of client/server performance. Some key optimizations discussed include reducing HTTP requests, optimizing response objects by reducing size and load pattern, JavaScript minification and placement, image sprites, caching, and ensuring valid HTML markup.
Building responsively allows us to create flexible user interfaces that support the widest possible audience with a single front-end codebase. But in embracing the ever-increasing contexts in which our sites are used, performance and accessibility must remain our highest priorities; we must continually question each code addition, and improve our delivery and application techniques to ensure they’re best serving users’ needs.
This talk will explore the challenges of creating fast and broadly-accessible websites and offer approaches that dramatically improve performance, usability, access, and sustainability.
Modernizr is a JavaScript library that detects which CSS and HTML5 features are supported by the user's browser. It allows for progressive enhancement by applying features when supported and providing alternatives when not. This helps websites work on a wide range of browsers while still taking advantage of newer features for supported browsers.
This document discusses various techniques for improving the frontend performance of Drupal websites. It begins by introducing the speaker and describing the goals of the presentation. The bulk of the document then provides recommendations in three areas: backend server optimizations like caching, parallel downloads and gzip compression; tools for measuring performance; and frontend optimizations like minimizing requests, lazy loading images, and improving CSS and JavaScript. The document encourages proper performance diagnosis and defines goals before implementing solutions.
Peter Rozek gave a presentation at WebTechCon 2015 about performance and user experience. Some of the key points from the presentation include:
- Slow page loads can cause 40% of users to abandon a site. Decreasing load times by 4 seconds for one site led to a 25% increase in page views.
- Performance needs to be considered from the beginning of a project in the concept and design phases, not just in development. It is important to set performance budgets and priorities.
- Users' perception of speed depends on how quickly a page is interactive, not just how long it takes to fully load. The goal should be for above-the-fold content to be usable within 1 second.
- Images
Similar to Are Today’s Good Practices… Tomorrow’s Performance Anti-Patterns? (20)
AB Testing, Ads and other 3rd party tags - London WebPerf - March 2018Andy Davies
Talk at Smashing Conf - 7th Feb 2018 (Video - https://vimeo.com/254703766)
Explores some of the issues that 3rd-party tags introduce when we add them to our sites, some ways of measuring the impact, and challenges we still have
AB Testing, Ads and other 3rd party tags - SmashingConf London - 2018Andy Davies
Talk at Smashing Conf - 7th Feb 2018 (Video - https://vimeo.com/254703766)
Explores some of the issues that 3rd-party tags introduce when we add them to our sites, some ways of measuring the impact, and challenges we still have
Inspecting iOS App Traffic with JavaScript - JSOxford - Jan 2018Andy Davies
This document discusses inspecting iOS app traffic with JavaScript by injecting scripts using Frida. It demonstrates capturing encrypted network traffic from an iOS app, extracting the TLS master secret and client/server randoms using a Frida script, and sending these values to the host computer to allow decrypting the traffic with Wireshark. The key steps are: using Frida to inject a script into an app, hooking the TLS PRF function to extract secret values, and sending these to the host to decrypt the HTTPS traffic in Wireshark. With these techniques, patterns in encrypted app traffic can be observed.
Slides from my talk at Bristol WebPerf Meetup 2017-07-20 where I talked about some of the approaches I use to persuade people that they should invest in making their sites faster
Speed: The 'Forgotten' Conversion FactorAndy Davies
Speed is a critical factor when it comes to converting browsers into buyers but it's often forgotten and other factors prioritised instead. Using real data from UK retailers this talk explores the relationship between speed and conversion
Building an Appier Web - London Web Standards - Nov 2016Andy Davies
Explores progressive web apps, what advantages they have versus native apps, how to build, and test them, and some of the challenges we still have ahead.
Slides from talk at London Web Standards, Nov 2016
Building an Appier Web - Velocity Amsterdam 2016Andy Davies
Explores progressive web apps, what advantages they have versus native apps, how to build, and test them, and some of the challenges we still have ahead.
Slides from talk at Velocity Amsterdam 2016
Slides from my talk at NCC Group's Web Performance Day in May 2016.
Compares the features of apps and the web, what's great about each and explores some of the technologies that will allow us to build websites that can deliver native like experiences.
The Fast, The Slow and The Unconverted - Emerce Conversion 2016Andy Davies
Slides from my talk at Emerce Conversion, Amsterdam on the importance of performance(page speed) for conversion.
Explore some of the performance issues we face when relying on third-party CRO products / services
The document discusses how mobile sites are getting slower due to larger page sizes from images, CSS, JavaScript and fonts. It provides tips for optimizing images, such as using responsive images and smaller image sizes. It also recommends prioritizing critical content over non-essential elements like unnecessary JavaScript and web fonts to improve page load times.
Speed matters, So why is your site so slow?Andy Davies
Slides from my talk at ReDevelop 2015
Covers business case for web performance, along with the fundamentals of how latency and the critical rendering path affect page load performance
HTTP/2 provides improvements over HTTP/1.1 such as multiplexed requests, header compression and priority hints from browsers that can reduce latency. While it shows benefits in testing, real-world impacts may be more modest depending on server and client configurations. Further optimizations are still needed and HTTP/2 opens up new possibilities around features like server pushing and progressive content delivery that could enhance performance.
Are Today’s Good Practices... Tomorrow’s Performance Anti-Patterns?Andy Davies
The web is ever changing… browsers are evolving, new protocols are emerging and mobile continues its relentless rise. We’re already starting to bend some of the original performance rules and as the web changes further will our current good practices last, or will some become barriers that hinder performance?
Are Today's Good Practices… Tomorrow's Performance Anti-PatternsAndy Davies
The document discusses how current web performance optimization practices may become obsolete or anti-patterns with new web technologies like HTTP/2 and SPDY. It summarizes results of tests comparing HTTP/1.1 to SPDY, finding that SPDY is faster with minimal optimizations. The document also examines how practices like sharding assets and inline JavaScript may not work as expected or introduce new issues with these protocols. It recommends starting to experiment now with tools like mod_pagespeed and mod_spdy to understand the effects of new technologies on performance best practices.
For the full video of this presentation, please visit: https://www.edge-ai-vision.com/2024/06/efficiency-unleashed-the-next-gen-nxp-i-mx-95-applications-processor-for-embedded-vision-a-presentation-from-nxp-semiconductors/
James Prior, Senior Product Manager at NXP Semiconductors, presents the “Efficiency Unleashed: The Next-gen NXP i.MX 95 Applications Processor for Embedded Vision” tutorial at the May 2024 Embedded Vision Summit.
Machine vision is the most obvious way to help humans live better, enabling hundreds of applications spanning security, monitoring, inspection and more. Modern edge processors need private on-device and scalable hybrid machine learning capabilities to offer enough longevity to stay relevant in industrial and commercial IoT markets. In this talk, Prior presents the upcoming i.MX 95 family of applications processors.
The i.MX 95 features a new, self-developed neural processing unit from NXP—the eIQ Neutron NPU. Designed to scale from today’s conventional neural networks to tomorrow’s transformer-based models, the eIQ Neutron NPU scalable architecture delivers edge AI capabilities at high efficiency with award-winning tools, combined with chip-level security and privacy features. The i.MX 95 applications processor family features powerful processing and vision capabilities combined with safety, security and expandable high-speed interfaces.
TrustArc Webinar - Your Guide for Smooth Cross-Border Data Transfers and Glob...TrustArc
Global data transfers can be tricky due to different regulations and individual protections in each country. Sharing data with vendors has become such a normal part of business operations that some may not even realize they’re conducting a cross-border data transfer!
The Global CBPR Forum launched the new Global Cross-Border Privacy Rules framework in May 2024 to ensure that privacy compliance and regulatory differences across participating jurisdictions do not block a business's ability to deliver its products and services worldwide.
To benefit consumers and businesses, Global CBPRs promote trust and accountability while moving toward a future where consumer privacy is honored and data can be transferred responsibly across borders.
This webinar will review:
- What is a data transfer and its related risks
- How to manage and mitigate your data transfer risks
- How do different data transfer mechanisms like the EU-US DPF and Global CBPR benefit your business globally
- Globally what are the cross-border data transfer regulations and guidelines
Corporate Open Source Anti-Patterns: A Decade LaterScyllaDB
A little over a decade ago, I gave a talk on corporate open source anti-patterns, vowing that I would return in ten years to give an update. Much has changed in the last decade: open source is pervasive in infrastructure software, with many companies (like our hosts!) having significant open source components from their inception. But just as open source has changed, the corporate anti-patterns around open source have changed too: where the challenges of the previous decade were all around how to open source existing products (and how to engage with existing communities), the challenges now seem to revolve around how to thrive as a business without betraying the community that made it one in the first place. Open source remains one of humanity's most important collective achievements and one that all companies should seek to engage with at some level; in this talk, we will describe the changes that open source has seen in the last decade, and provide updated guidance for corporations for ways not to do it!
Leveraging AI for Software Developer Productivity.pptxpetabridge
Supercharge your software development productivity with our latest webinar! Discover the powerful capabilities of AI tools like GitHub Copilot and ChatGPT 4.X. We'll show you how these tools can automate tedious tasks, generate complete syntax, and enhance code documentation and debugging.
In this talk, you'll learn how to:
- Efficiently create GitHub Actions scripts
- Convert shell scripts
- Develop Roslyn Analyzers
- Visualize code with Mermaid diagrams
And these are just a few examples from a vast universe of possibilities!
Packed with practical examples and demos, this presentation offers invaluable insights into optimizing your development process. Don't miss the opportunity to improve your coding efficiency and productivity with AI-driven solutions.
For senior executives, successfully managing a major cyber attack relies on your ability to minimise operational downtime, revenue loss and reputational damage.
Indeed, the approach you take to recovery is the ultimate test for your Resilience, Business Continuity, Cyber Security and IT teams.
Our Cyber Recovery Wargame prepares your organisation to deliver an exceptional crisis response.
Event date: 19th June 2024, Tate Modern
Brightwell ILC Futures workshop David Sinclair presentationILC- UK
As part of our futures focused project with Brightwell we organised a workshop involving thought leaders and experts which was held in April 2024. Introducing the session David Sinclair gave the attached presentation.
For the project we want to:
- explore how technology and innovation will drive the way we live
- look at how we ourselves will change e.g families; digital exclusion
What we then want to do is use this to highlight how services in the future may need to adapt.
e.g. If we are all online in 20 years, will we need to offer telephone-based services. And if we aren’t offering telephone services what will the alternative be?
Chapter 3 of ISTQB Foundation 2018 syllabus with sample questions. Answers about what is static testing, what is review, types of review, informal review, walkthrough, technical review, inspection.
CNSCon 2024 Lightning Talk: Don’t Make Me Impersonate My IdentityCynthia Thomas
Identities are a crucial part of running workloads on Kubernetes. How do you ensure Pods can securely access Cloud resources? In this lightning talk, you will learn how large Cloud providers work together to share Identity Provider responsibilities in order to federate identities in multi-cloud environments.
Multimodal Retrieval Augmented Generation (RAG) with MilvusZilliz
We've seen an influx of powerful multimodal capabilities in many LLMs. In this talk, we'll vectorize a dataset of images and texts into the same embedding space, store them in Milvus, retrieve all relevant data using multilingual texts and/or images and input multimodal data as context into GPT-4o.
What is an RPA CoE? Session 4 – CoE ScalingDianaGray10
How to scale a COE to meet organizational missions.
Topics covered:
• What is the original focal area?
• How to expand the COE globally.
• Is a centralized or decentralized model better for scaling?
Speaker:
Chris Bolin, Senior Intelligent Automation Architect Anika Systems
The presentation will delve into the ASIMOV project, a novel initiative that leverages Retrieval-Augmented Generation (RAG) to provide precise, domain-specific assistance to telecommunications engineers and technicians. The session will focus on the unique capabilities of Milvus, the chosen vector database for the project, and its advantages over other vector databases.
Attending this session will give you a deeper understanding of the potential of RAG and Milvus DB in telecommunications engineering. You will learn how to address common challenges in the field and enhance the efficiency of their operations. The session will equip you with the knowledge to make informed decisions about the choice of vector databases, and how best to use them for your use-cases
8. Replace image path with dataURI
!
.selector {
background-image: url(
!
!
!
!
!
}
data:image/
png;base64,iVBORw0KGgoAAAANSUhEUgAAABkA
AAAZCAMAAADzN3VRAAAAGXRFWHRTb2Z0d2FyZQB
BZG9iZSBJbWFnZVJlYWR5ccllPAAAAAZQTFRF/
wAAAAAAQaMSAwAAABJJREFUeNpiYBgFo2AwAIAA
AwACigABtnCV2AAAAABJRU5ErkJggg==);
dataURIs can also be used with other non-image elements too
9. Reduces number of requests but it’s a tradeoff
Makes a blocking resource (CSS) larger by including non-blocking resources!
• Browser can’t start rendering page until CSS has downloaded *!
• Images don’t block!
!
Do they have the same caching lifetime?!
Overrides browsers pre-loader heuristics
* Some browsers defer download of CSS when media query doesn’t match
10. Test the theory
http://www.flickr.com/photos/marc-flores/8367323660
11. 1.Take 50 icons!
2.Create 50 stylesheets, each with one
more dataURI than previous!
3.Create matching HTML file for each
stylesheet!
4.Test them all! (using WebPagetest)
23. Prioritisation sometimes has unexpected consequences
These JS resources are
at the foot of the body!
(perhaps they should merge them into
fewer resources but…)
24. Prioritisation sometimes has unexpected consequences
The hero image is
delayed as it waits for
the JS to downloaded
25. New network protocols are coming here
http://www.flickr.com/photos/jonlachance/3427660741
26. They use TCP connections differently
HTTP 1.1
SPDY
29. How much do we rely on inline JavaScript?
www.flickr.com/photos/jfraissi/6352877711
30. 82% of visitors support async attribute
!
<script async src="script.js"></script>
http://caniuse.com/script-async
31. 82% of visitors support async attribute
!
<script async src="script.js"></script>
http://caniuse.com/script-async
Tells browsers they don’t need
pause DOM construction while
the JavaScript downloads and
executes
32. Yet, this is how we typically load scripts asynchronously
<script type="text/javascript">
(function() {
var js = document.createElement('script');
js.async = true;
js.src = 'script.js';
var e = document.getElementsByTagName('script')[0];
e.parentNode.insertBefore(js, first);
})();
</script>
33. Yet, this is how we typically load scripts asynchronously
<script type="text/javascript">
(function() {
Browser won’t discover
script until outer script
inserts it into DOM
var js = document.createElement('script');
js.async = true;
js.src = 'script.js';
var e = document.getElementsByTagName('script')[0];
e.parentNode.insertBefore(js, first);
})();
</script>
35. Content-Security-Policy
“Content Security Policy, a mechanism web applications
can use to mitigate a broad class of content injection
vulnerabilities, such as cross-site scripting (XSS)”
http://www.w3.org/TR/CSP/
36. Only allow scripts to be executed if they come from a designated host,
disables inline scripts by default.
Content-Security-Policy: script-src http://www.site.com
Can re-enable inline scripts, but increases XSS risk
Content-Security-Policy script-src 'self'
Doesn’t just apply to scripts, can be used with CSS, fonts, images etc.
37. What other performance enhancements do we rely on inline JS for?
The Guardian prioritise their content!
!
Divide page load into:!
- Content!
- Enhancements!
- Leftovers !
!
Some sites rely on scroll handlers for lazyloading
39. W3C Resource Priorities - adds lazyload attribute
(also look at Ilya Grigorik’s proposal for Resource Hints)
40. So what about the network?
http://www.flickr.com/photos/uwwresnet/5881727219
52. Combine small images into CSS Sprites
To get just one sprite …
Browser must download and
decode the whole image
53. There’s a tension between development and delivery
https://www.flickr.com/photos/domiriel/7376397968
54. SPDY & HTTP/2 can reduce that tension
SPDY
Multiplexed connection reduces overhead of requests!
! - less need to merge resources!
! - better cache hit ratios
65. Browser Server
Server!
builds!
page
GET index.html
<html><head>…
Loading a web page
Request other page resources
66. Browser Server
Server!
builds!
page
GET index.html
<html><head>…
Network!
Idle
Request other page resources
Loading a web page
67. Browser Server
Server!
builds!
page
GET index.html
Push critical resource e .g. CSS
<html><head>…
Server Push
Request other page resources
68. Browser Server
Server!
builds!
page
GET index.html
Push critical resource e .g. CSS
<html><head>…
Request other page resources
Server Push
69. Browser Server
Server!
builds!
page
GET index.html
Push critical resource e .g. CSS
<html><head>…
Request other page resources
Server Push
Browser can reject push
70. Other opportunities for server push?
HTML
CSS
DOM
CSSOM
Render!
Tree
JavaScript Layout Paint
71. Other opportunities for server push?
HTML
CSS
DOM
CSSOM
Render!
Tree
Fonts and background
images discovered
when render tree builds
JavaScript Layout Paint
72. Other opportunities for server push?
HTML
CSS
DOM
CSSOM
Render!
Tree
Fonts and background
images discovered
when render tree builds
JavaScript Layout Paint
Could we push them?
73. There’s a huge amount to cope with
http://www.flickr.com/photos/atoach/6014917153
74. and it’s only going to get more complex
http://www.flickr.com/photos/freshwater2006/693945631