All Projects → Niresh12495 → LazyHTML

Niresh12495 / LazyHTML

Licence: AGPL-3.0 license
LazyHTML is an OpenSource Javascript Library that Supports Lazy Loading of any elements without Modifying Code, LazyHTML can lazy load Ads, Videos, Images, Widgets, Javascript, CSS, Inline-Javascript, Inline-CSS & Any HTML.

Programming Languages

javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to LazyHTML

Douban Movie
🎥The douban-movie Application built with webpack + vue + vuex + vue-router + iView.
Stars: ✭ 147 (+212.77%)
Mutual labels:  lazyload
Vue Lazyload Img
A plugin of vue for image lazyload(vue图片懒加载插件)
Stars: ✭ 250 (+431.91%)
Mutual labels:  lazyload
guide-to-async-components
📖 Guide To JavaScript Async Components
Stars: ✭ 79 (+68.09%)
Mutual labels:  lazyload
React In Viewport
Detect if React component is in viewport
Stars: ✭ 183 (+289.36%)
Mutual labels:  lazyload
React Progressive Loader
Utility to load images and React components progressively, and get code splitting for free
Stars: ✭ 224 (+376.6%)
Mutual labels:  lazyload
angular-webpack-material-lazyload-typescript-starter-template
Angular starter template using typescript, angular-material, ui-router, oclazyload with webpack support.
Stars: ✭ 55 (+17.02%)
Mutual labels:  lazyload
React Lazy
Universal lazy loader components using IntersectionObserver for React
Stars: ✭ 118 (+151.06%)
Mutual labels:  lazyload
raf-pool
requestAnimationFrame pool to avoid busyness on the thread
Stars: ✭ 16 (-65.96%)
Mutual labels:  lazyload
Oclazyload
Lazy load modules & components in AngularJS
Stars: ✭ 2,661 (+5561.7%)
Mutual labels:  lazyload
Xcode-AutoLazyLoad
简单的Xcode代码模板extension
Stars: ✭ 23 (-51.06%)
Mutual labels:  lazyload
Lazy Progressive Enhancement
A lazy image loader designed to enforce progressive enhancement and valid HTML.
Stars: ✭ 188 (+300%)
Mutual labels:  lazyload
Lazyload Image
HTMLImageElement extension for lazy loading.
Stars: ✭ 208 (+342.55%)
Mutual labels:  lazyload
core-serp-vitals
Show the Core Web Vitals from the Chrome User Experience Report in the Google Search Results.
Stars: ✭ 25 (-46.81%)
Mutual labels:  core-web-vitals
Ng In Viewport
Allows us to check if an element is within the browsers visual viewport
Stars: ✭ 178 (+278.72%)
Mutual labels:  lazyload
lazy-load-images.js
Progressive & lazy loading images.
Stars: ✭ 17 (-63.83%)
Mutual labels:  lazyload
Defer.js
🥇 A super small, super efficient library that helps you lazy load everything like images, video, audio, iframe as well as stylesheets, and JavaScript.
Stars: ✭ 138 (+193.62%)
Mutual labels:  lazyload
Lazysizes
High performance and SEO friendly lazy loader for images (responsive and normal), iframes and more, that detects any visibility changes triggered through user interaction, CSS or JavaScript without configuration.
Stars: ✭ 15,716 (+33338.3%)
Mutual labels:  lazyload
loadeer
🦌 Tiny, performant, SEO-friendly lazy loading library
Stars: ✭ 30 (-36.17%)
Mutual labels:  lazyload
rocket-lazy-load
Standalone LazyLoad plugin for WordPress (based on WP Rocket)
Stars: ✭ 25 (-46.81%)
Mutual labels:  lazyload
react-use-lazy-load-image
🌅 ⚡ Add image lazy loading to your React app with ease
Stars: ✭ 13 (-72.34%)
Mutual labels:  lazyload

LazyHTML: Lazy load Ads, Widgets, Images & Any HTML elements.

LazyHTML is an OpenSource Javascript Library that Supports Lazy Loading any elements without Modifying Code, LazyHTML can lazy load Ads, Videos, Images, Widgets, Javascript, CSS, Inline-Javascript, Inline-CSS & Any HTML. LazyHTML was initially developed with the intention to Lazy Load Ads

Features & Pros

  • Cross browser compatible.

  • Support Asynchronous loading.

  • LazyHTML can load Both Asynchronous & Synchronous Ads, Widgets, Javascript codes Asynchronously.

  • No HTML, Javascript or CSS Code modification required when Lazy Loading elements.

  • LazyHTML Supports lazy loading Ads without Modifying Adcodes.

  • Uses Intersection Observer with fall back to eager loading on its absence.

  • Supports eager loading.

  • Supports media queries.

  • Supports container dimension conditions.

    Cons

  • HTML, CSS or Javascript comments are not allowed inside the wrapper.

How it Works

Load the script.

 <script async src="https://cdn.jsdelivr.net/npm/[email protected]/dist/lazyhtml.min.js" crossorigin="anonymous" debug></script>

Wrap the elements those you want to Lazy Load.

<div class="lazyhtml" data-lazyhtml>
  <script type="text/lazyhtml">
  <!--
  
Your HTML, CSS or Adcodes here. (including wrapping <script>,<style> tags)
  
  -->
  </script>
</div>

Installation

Install via npm:

npm install --save lazyhtml

Support

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].