SlideShare uma empresa Scribd logo
1 de 8
Example of implementation with Google ads
• Pages are complex: lots of resources from
  various domains

• A lot of what's loaded is third party content



             We need unobstrusive loading
             techniques to get better perfs.
   On TGU FR Homepage, we have 3 DFP
    (Doubleclick for Publishers) ads

Impact:
   15 HTTP requests, 78KB total
   Scripts block the page’s content from downloading
Concept
    iframe on the same origin that serves remote content

How is it possible?
   The previous heavy script is replaced with a very small
    script that only creates the iframe
   Inside this iframe, it executes the heavy time-
    consuming script that will get the ads
   It creates another friendly iframe that contains the ad
Why is a friendly iframe that
 awesome?
 Ads can be loaded in parallel with the rest of the page
 Start of loading ads can be delayed, regardless of tag
  placement (not possible with either standard method)
 Ads may be loaded using AJAX or other dynamic
  coding frameworks, without introducing compatibility
  issues due to ads using document.write() etc.
 Gives the ad access to the DOM of the page, allowing
  interstitials, expanding ads, resizing the iframe…
With his new DFP ads, Google offers the
    best current solution

 The script that creates the iframe is asynchronous
 The single request mode : 1 HTTP request for all ads
  slots
 Asynchronously refreshing ad slots
 Support for expanding ads
Friendly iframes
Friendly iframes

Mais conteúdo relacionado

Mais procurados

Chrome Extension Development - Adam Horvath, Google Technology User Group, Sy...
Chrome Extension Development - Adam Horvath, Google Technology User Group, Sy...Chrome Extension Development - Adam Horvath, Google Technology User Group, Sy...
Chrome Extension Development - Adam Horvath, Google Technology User Group, Sy...
adamhorvath
 

Mais procurados (20)

wp cli- don’t fear the command line
wp cli- don’t fear the command linewp cli- don’t fear the command line
wp cli- don’t fear the command line
 
Grav CMS
Grav CMSGrav CMS
Grav CMS
 
WordPress Multilingual: WordCamp Antwerp 2016
WordPress Multilingual: WordCamp Antwerp 2016WordPress Multilingual: WordCamp Antwerp 2016
WordPress Multilingual: WordCamp Antwerp 2016
 
Basic Wordpress Session
Basic Wordpress SessionBasic Wordpress Session
Basic Wordpress Session
 
Chrome Extension Development - Adam Horvath, Google Technology User Group, Sy...
Chrome Extension Development - Adam Horvath, Google Technology User Group, Sy...Chrome Extension Development - Adam Horvath, Google Technology User Group, Sy...
Chrome Extension Development - Adam Horvath, Google Technology User Group, Sy...
 
Les Basiques - Web Développement HTML5, CSS3, JS et PHP
Les Basiques - Web  Développement HTML5, CSS3, JS et PHPLes Basiques - Web  Développement HTML5, CSS3, JS et PHP
Les Basiques - Web Développement HTML5, CSS3, JS et PHP
 
WordCamp RVA 2011 - Performance & Tuning
WordCamp RVA 2011 - Performance & TuningWordCamp RVA 2011 - Performance & Tuning
WordCamp RVA 2011 - Performance & Tuning
 
Websites for Hackers
Websites for HackersWebsites for Hackers
Websites for Hackers
 
Template tuning for high performance
Template tuning for high performanceTemplate tuning for high performance
Template tuning for high performance
 
Introduction to Wordpress
Introduction to WordpressIntroduction to Wordpress
Introduction to Wordpress
 
Presentation1
Presentation1Presentation1
Presentation1
 
Javascript - Getting started | DevCom ISITCom
Javascript - Getting started | DevCom ISITComJavascript - Getting started | DevCom ISITCom
Javascript - Getting started | DevCom ISITCom
 
Modern Web Application Development Workflow - EclipseCon US 2014
Modern Web Application Development Workflow - EclipseCon US 2014Modern Web Application Development Workflow - EclipseCon US 2014
Modern Web Application Development Workflow - EclipseCon US 2014
 
The Power of a Video Library - WordCamp Raleigh
The  Power of a Video Library - WordCamp RaleighThe  Power of a Video Library - WordCamp Raleigh
The Power of a Video Library - WordCamp Raleigh
 
High Performance - Joomla!Days NL 2009 #jd09nl
High Performance - Joomla!Days NL 2009 #jd09nlHigh Performance - Joomla!Days NL 2009 #jd09nl
High Performance - Joomla!Days NL 2009 #jd09nl
 
Front-End Performance Optimizing
Front-End Performance OptimizingFront-End Performance Optimizing
Front-End Performance Optimizing
 
Introduction to WordPress
Introduction to WordPressIntroduction to WordPress
Introduction to WordPress
 
Building a community of Open Source intranet users
Building a community of Open Source intranet usersBuilding a community of Open Source intranet users
Building a community of Open Source intranet users
 
2011 05 word-press-not-just-for-blogging-anymore
2011 05 word-press-not-just-for-blogging-anymore2011 05 word-press-not-just-for-blogging-anymore
2011 05 word-press-not-just-for-blogging-anymore
 
What is the Responsibility of Plugin Developers?
What is the Responsibility of Plugin Developers?What is the Responsibility of Plugin Developers?
What is the Responsibility of Plugin Developers?
 

Semelhante a Friendly iframes

0116v1_GL_Retargeting_Glossary
0116v1_GL_Retargeting_Glossary0116v1_GL_Retargeting_Glossary
0116v1_GL_Retargeting_Glossary
Holly Sanger
 
Dynamic websites lec5
Dynamic websites lec5Dynamic websites lec5
Dynamic websites lec5
Belal Arfa
 
Docs Python Org Howto Webservers Html
Docs Python Org Howto Webservers HtmlDocs Python Org Howto Webservers Html
Docs Python Org Howto Webservers Html
AkramWaseem
 
Internet programming lecture 1
Internet programming lecture 1Internet programming lecture 1
Internet programming lecture 1
Mohammed Hussein
 
Google chrome extension
Google chrome extensionGoogle chrome extension
Google chrome extension
Johnny Kingdom
 

Semelhante a Friendly iframes (20)

Google Adsense
Google AdsenseGoogle Adsense
Google Adsense
 
Display Ads Performance with Sugar
Display Ads Performance with SugarDisplay Ads Performance with Sugar
Display Ads Performance with Sugar
 
0116v1_GL_Retargeting_Glossary
0116v1_GL_Retargeting_Glossary0116v1_GL_Retargeting_Glossary
0116v1_GL_Retargeting_Glossary
 
The Same-Origin Policy
The Same-Origin PolicyThe Same-Origin Policy
The Same-Origin Policy
 
Cdn optimizely and how latency affects load speed
Cdn optimizely and how latency affects load speedCdn optimizely and how latency affects load speed
Cdn optimizely and how latency affects load speed
 
Boosting your conversion rate through web performance improvements
Boosting your conversion rate through web performance improvementsBoosting your conversion rate through web performance improvements
Boosting your conversion rate through web performance improvements
 
Week13
Week13Week13
Week13
 
Week13
Week13Week13
Week13
 
X realtime xmp-ptut-pdf
X realtime xmp-ptut-pdfX realtime xmp-ptut-pdf
X realtime xmp-ptut-pdf
 
Dynamic websites lec5
Dynamic websites lec5Dynamic websites lec5
Dynamic websites lec5
 
Bruce Lawson Opera Indonesia
Bruce Lawson Opera IndonesiaBruce Lawson Opera Indonesia
Bruce Lawson Opera Indonesia
 
SEO tips 2013
SEO tips 2013SEO tips 2013
SEO tips 2013
 
Docs Python Org Howto Webservers Html
Docs Python Org Howto Webservers HtmlDocs Python Org Howto Webservers Html
Docs Python Org Howto Webservers Html
 
AEM & Single Page Applications (SPAs) 101
AEM & Single Page Applications (SPAs) 101AEM & Single Page Applications (SPAs) 101
AEM & Single Page Applications (SPAs) 101
 
Static dynamic and active web pages
Static dynamic and active web pagesStatic dynamic and active web pages
Static dynamic and active web pages
 
High Performance Web Sites, With Ads: Don't let third parties make you slow
High Performance Web Sites, With Ads: Don't let third parties make you slowHigh Performance Web Sites, With Ads: Don't let third parties make you slow
High Performance Web Sites, With Ads: Don't let third parties make you slow
 
Internet programming lecture 1
Internet programming lecture 1Internet programming lecture 1
Internet programming lecture 1
 
Get AMP’ed for AMP!
Get AMP’ed for AMP!Get AMP’ed for AMP!
Get AMP’ed for AMP!
 
Google chrome extension
Google chrome extensionGoogle chrome extension
Google chrome extension
 
Front-End Performance Checklist 2020
Front-End Performance Checklist 2020Front-End Performance Checklist 2020
Front-End Performance Checklist 2020
 

Último

Architecting Cloud Native Applications
Architecting Cloud Native ApplicationsArchitecting Cloud Native Applications
Architecting Cloud Native Applications
WSO2
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Safe Software
 

Último (20)

How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024
 
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ..."I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
 
Architecting Cloud Native Applications
Architecting Cloud Native ApplicationsArchitecting Cloud Native Applications
Architecting Cloud Native Applications
 
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
 
ICT role in 21st century education and its challenges
ICT role in 21st century education and its challengesICT role in 21st century education and its challenges
ICT role in 21st century education and its challenges
 
MS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectorsMS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectors
 
presentation ICT roal in 21st century education
presentation ICT roal in 21st century educationpresentation ICT roal in 21st century education
presentation ICT roal in 21st century education
 
A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?
 
Apidays Singapore 2024 - Modernizing Securities Finance by Madhu Subbu
Apidays Singapore 2024 - Modernizing Securities Finance by Madhu SubbuApidays Singapore 2024 - Modernizing Securities Finance by Madhu Subbu
Apidays Singapore 2024 - Modernizing Securities Finance by Madhu Subbu
 
Corporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptxCorporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptx
 
2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
 
Strategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a FresherStrategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a Fresher
 
Real Time Object Detection Using Open CV
Real Time Object Detection Using Open CVReal Time Object Detection Using Open CV
Real Time Object Detection Using Open CV
 
Exploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone ProcessorsExploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone Processors
 
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost SavingRepurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
 
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfBoost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdf
 
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, AdobeApidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
 

Friendly iframes

  • 1. Example of implementation with Google ads
  • 2. • Pages are complex: lots of resources from various domains • A lot of what's loaded is third party content We need unobstrusive loading techniques to get better perfs.
  • 3. On TGU FR Homepage, we have 3 DFP (Doubleclick for Publishers) ads Impact:  15 HTTP requests, 78KB total  Scripts block the page’s content from downloading
  • 4. Concept iframe on the same origin that serves remote content How is it possible?  The previous heavy script is replaced with a very small script that only creates the iframe  Inside this iframe, it executes the heavy time- consuming script that will get the ads  It creates another friendly iframe that contains the ad
  • 5. Why is a friendly iframe that awesome?  Ads can be loaded in parallel with the rest of the page  Start of loading ads can be delayed, regardless of tag placement (not possible with either standard method)  Ads may be loaded using AJAX or other dynamic coding frameworks, without introducing compatibility issues due to ads using document.write() etc.  Gives the ad access to the DOM of the page, allowing interstitials, expanding ads, resizing the iframe…
  • 6. With his new DFP ads, Google offers the best current solution  The script that creates the iframe is asynchronous  The single request mode : 1 HTTP request for all ads slots  Asynchronously refreshing ad slots  Support for expanding ads