A faster website! (aka defer.js)

Descripción

⚡️ A native, blazing fast lazy loader. ✅ Legacy browsers support (IE9+). 💯 SEO friendly. 🧩 Lazy-load everything.

This plugin helps you to optimize everything like image tags, video, audio, iframes as well as stylesheets, and JavaScript.

This plugin incorporates tips used a lot by experienced web experts, as well as making the most of the latest web technologies in lazy-loading resources on the page.

Rate 5 stars (⭐️⭐️⭐️⭐️⭐️) if you guys like it.

What people loves

  • ⚡️ Native API, blazing fast
  • 👍 Legacy browsers support (IE9+)
  • 🥇 SEO friendly
  • ✅ Very easy to use
  • 💯 No dependencies, no jQuery
  • 🤝 Works well with your favorite frameworks
  • 🧩 Uses IntersectionObserver API for optimized CPU usage
  • 🏞 Supports for responsive images, both srcset and sizes attributes

💡 Tip: To archive better result, you should consider disabling all optimization features (Eg. lazy-loading, HTML minification, JS minification, etc.) by other plugins.

We recommend you use it with another page-caching plugin for best performance.

Browser support

This plugin also works perfectly on popular browsers, including Internet Explorer 9 and later.

  • 🖥 IE9+ / Microsoft EDGE
  • 🖥 Firefox 4+
  • 🖥 Safari 3+
  • 🖥 Chrome
  • 🖥 Opera
  • 📱 Android 4+
  • 📱 iOS 3.2+

Powered by defer.js, defer.php

defer.js
🥇 A super small, super efficient library that helps you lazy load almost everything like images, video, audio, iframes as well as stylesheets, and JavaScript.

defer.php
🚀 A PHP library that focuses on minimizing payload size of HTML document and optimizing processing on the browser when rendering the web page.

Key features

  • [x] Embed defer.js plugin
  • [x] Normalize DOM elements
  • [x] Fix missing meta tags
  • [x] Fix missing media attributes
  • [x] Preconnect to required origins
  • [x] Preload key requests
  • [x] Prefetch key requests
  • [x] Browser-level image lazy-loading for the web
  • [x] Lazy-load offscreen and hidden iframes
  • [x] Lazy-load offscreen and hidden videos
  • [x] Lazy-load offscreen and hidden images
  • [x] Lazy-load CSS background images
  • [x] Reduce the impact of JavaScript
  • [x] Defer non-critical CSS requests
  • [x] Defer third-party assets
  • [x] Add fallback <noscript> tags for lazy-loaded objects
  • [x] Add custom HTML while browser is rendering the page (splashscreen)
  • [x] Attribute to ignore optimizing the element
  • [x] Attribute to ignore lazyloading the element
  • [x] Optimize AMP document
  • [x] Minify HTML output

Support my activities

Keep up-to-date with new releases:
https://wordpress.org/plugins/shins-pageload-magic/

Donate via Paypal
Become a sponsor
Become a stargazer
Report an issue

Released under the GNU General Public License v2 license.
https://github.com/shinsenter/defer-wordpress/blob/master/LICENSE

Copyright (c) 2019 Mai Nhut Tan <shin@shin.company>

Capturas

  • Scoring 100/100 in Google PageSpeed Test!
  • Defer almost anything, easily speed up your website.

Instalación

  1. Upload defer-wordpress to the /wp-content/plugins/ directory
  2. Activate the plugin through the ‘Plugins’ menu in WordPress

This plugin still supports PHP 5.6, but we recommend that your server should be running PHP version 7.4 or greater for better performance.

FAQ

What is defer.js?

🥇 A super tiny, native performance library for lazy-loading JS, CSS, images, iframes… Defer almost anything, easily speed up your website.

Why should I lazy-load my content?

The loading of contents on web page may make your load speed more slow, no one likes staring at a blank white page; users are impatient and will leave quickly.

Lazy loading content on web page can help reduce resource contention and improve performance.

Why should I use this plugin?

This plugin supports you to handle some common tips to help your website optimize the download of on-page resources.

These tips are published at following website by Google Developers, if you are interested you can consult to understand more about website optimization.

You can also manually implement these tips your-self, but it takes a lot of time and requires a lot of expertise.

How does this plugin work?

This plugin helps you to optimize everything like image tags, video, audio, iframes as well as stylesheets, and JavaScript.

This plugin incorporates tips used a lot by experienced web experts, as well as making the most of the latest web technologies in lazy-loading resources on the page.

Among them are creating «data-src» attributes to laza-load the media, even the loading=»lazy» feature recently introduced by Google Developers.

High performance and accuracy

In addition, this plugin uses DOM to process the website structure so it produces accurate results and is faster than any other plugin that uses HTML text processing.

You can give it a try and I believe you will be surprised by the results it brings to your website.

How about performance and compatibility?

We have tested this plugin with quite a few others and have not found any significant conflicts.

For best use of this plugin, you should consider disabling all optimization features (Eg. lazy-loading, HTML minification, JS minification, etc.) by other plugins.

We recommend you use it with another page-caching plugin for best performance.

Reseñas

15 de mayo de 2021
I am very happy and satisfy with it, it's a lightweight and very promising plugin. Just install the plugin and keep everything default, It will boost your page speed significantly. In some cases, you can manually exclude by CSS class if you have elements that don't want to be lazyloaded. The developer is a very responsive and quick reply. I am using oxygen builder, If it has a pro version (lifetime deal) for early birds adopters, I'd like to buy it. Great plugin! deserver 5 stars!
14 de abril de 2021
easy configuration and very efficient performance plugin. It was the only plugin that really managed to make an efficient defer and lazy on my site, without errors! my lighthouse score for Mobile devices jumped from 22 to 84 by combining this plugin + plugin unload feature by Asset Cleanup Pro. Note: for those who use Cloudflare, it will be necessary to disable "mirage" if you want to use the plugin's lazy (it seemed more efficient than Mirage cloudflare)
22 de marzo de 2021
0.5 second to charge page it's my best speed record! Many Thanks 4 your hard work ...
15 de marzo de 2021
GOOD + Very good performance + Easy to configure + Compatible with animations in Elementor page builder BAD - Nothing yet
Leer todas las 42 reseñas

Colaboradores y desarrolladores

«A faster website! (aka defer.js)» es un software de código abierto. Las siguientes personas han colaborado con este plugin.

Colaboradores

Traduce «A faster website! (aka defer.js)» a tu idioma.

¿Interesado en el desarrollo?

Revisa el código , echa un vistazo al repositorio SVN o suscríbete al registro de desarrollo por RSS.

Registro de cambios

2.4 Small updates and documentations

2.3 Bug fixes and improvements

2.2 Code improvements

2.1 Bug fixes (https://github.com/shinsenter/defer.js/issues/82)

2.0 Upgraded to v2. Renamed plugin.

1.1.15 Fixed bugs in defer.js 1.1.13, 1.1.14

1.1.14 Improved performance

1.1.13 Fixed some Firefox bugs

1.1.12 Fixed some IE bugs, tested with the latest WordPress version

1.1.11 Fixed security issue (Fixed CVE-2019-18888)

1.1.10+5 Removed external resources

1.1.10 Bug fixes and improvements

1.1.9 Fixed wrong encoding when using mb_detect_encoding() function

1.1.8 Updated defer.php library (v1.0.15)

1.1.7 Fixed issues of FireFox, code improvements

1.1.6 Updated library version, improved javascript execution order

1.1.5 Hotfix: Escape HTML node value

1.1.4 Many improvements

1.1.3 Unify lazy attributes of another plugins

1.1.2 Fixed some known issues with gtm.js, improve plugin’s caches

1.1.1 Small bug fixes (IE polyfill, missing meta tags, preloading ads)

1.1.0 Added settings page

1.0.9 Improved preloading code

1.0.8 Fixed issues with open web fonts

1.0.7 Optimized scriptloader, polyfill, scrset

1.0.6 Small bug fixes (color placeholders, css)

1.0.5 Migrated with defer.js library

1.0.0 ~ 1.0.4 The first implement