vue-lazy-renderer

Lazily render Vue.js components for performance.

48,387 1

vue plugin ssr observer performance lazyload optimization lazy render intersection

Install
`npm install vue-lazy-renderer`
Latest Version:	1.2.1 (Mar 5, 2021)
Vue:	2
License:	MIT
Last Updated:	Mar 5, 2021
Links:	GitHub · npm

Maintainer: yeefun

Lazily render Vue.js components for performance.

Speed. Use the Intersection Observer API (IO) to prevent performance problems.
Degrade Gracefully. If a user's browser doesn't support the IO, use getBoundingClientRect instead. (vue-lazy-renderer does not load the IO polyfill—it is too fat. You can load it by yourself.)
Lightweight. Only 3.7 kB minified.
Highly Customized. You can globally set several options and locally override them.

npm:

npm install vue-lazy-renderer

Yarn:

yarn add vue-lazy-renderer

Use a plugin to register a global component:

import VueLazyRenderer from 'vue-lazy-renderer';
import Vue from 'vue';

Vue.use(VueLazyRenderer);

Parameter	Description	Type	Default
tagName	The tag name of the root node of `<lazy-renderer>`	String	'div'
preLoad	The proportion of a pre-loading height or width to `window.innerHeight` or `window.innerWidth`	Number	1.5
observerOptions	The Intersection Observer options	Object	{ rootMargin: '0px 50% 50% 0px' }
listenedEvents	The events you want `window` to listen for (used by `getBoundingClientRect`)	Array	['scroll', 'resize', 'orientationChange']
throttledWait	The number of milliseconds to throttle invocations to	Number	100

Name	Description
load	Start to load elements wrapped in `<lazy-renderer>`

Related Packages

vue-ssr-webpack-plugin

webpack plugin for generating a bundle manifest to use with Vue 2.x bundleRender...

100,967

plugin ssr vue webpack

vue3-lazy-load-component

Vue component for lazy rendering code

492 0

lazy render plugin vue vue3

@harlem/plugin-ssr

The official server-side rendering plugin for Harlem

14,341 515

plugin ssr vue harlem state

vue-intersection-plugin

a plugin

527 6

intersection plugin vue directive log

vue-resize-observer

Vue普通元素resize事件监听

148,954 63

observer plugin vue event resize vue3