
Security News
New CVE Forecasting Tool Predicts 47,000 Disclosures in 2025
CVEForecast.org uses machine learning to project a record-breaking surge in vulnerability disclosures in 2025.
lazy-js-utils
Advanced tools
A collection of lazy-loaded JavaScript utilities for efficient development
🎯 专为现代开发者打造的轻量级 JavaScript 工具库
📖 在线文档 • English • 快速开始 • 特色功能
🎯 告别繁琐 - 200+ 精选函数,解决 90% 的日常开发需求 ⚡ 开箱即用 - 零配置,直接在任何 JS 环境中使用 🧩 按需引入 - Tree-shaking 友好,只打包你用到的代码 🛡️ 类型安全 - 完整的 TypeScript 支持,IDE 智能提示 🔄 自动清理 - 智能内存管理,告别内存泄漏烦恼
# 安装
npm install lazy-js-utils
import {
insertElement,
useEventListener,
useMutationObserver,
} from 'lazy-js-utils'
// 🎯 一行代码添加事件监听,自动清理
const stopListening = useEventListener('#button', 'click', () => {
console.log('点击了按钮!')
})
// 🔍 监听 DOM 变化,无需 ref
useMutationObserver('#container', (mutations) => {
console.log('容器内容发生变化:', mutations)
})
// ➕ 简单的元素操作
insertElement('#container', '<div>新内容</div>')
// 传统方式 😵
const container = document.querySelector('#container')
const newElement = document.createElement('div')
newElement.innerHTML = 'Hello World'
container?.appendChild(newElement)
// Lazy JS Utils 方式 😎
insertElement('#container', '<div>Hello World</div>')
// 自动清理的事件监听
const stop = useEventListener(window, 'resize', () => {
console.log('窗口大小改变')
})
// 页面卸载时自动调用 stop(),无需手动清理!
// 高性能动画帧控制
useRaf(
(timestamp) => {
// 每秒执行一次的动画
updateAnimation(timestamp)
},
{
delta: 1000,
autoStop: true, // 执行一次后自动停止
},
)
模块 | 功能 | 示例 |
---|---|---|
🎯 DOM | 元素操作、选择器 | insertElement , removeElement |
🎮 Events | 事件监听、自动清理 | useEventListener , useMutationObserver |
🎬 Animation | 动画帧、缓动函数 | useRaf , useInterval |
🔧 Utils | 工具函数、类型判断 | deepCompare , throttle , debounce |
📝 String | 字符串处理 | camelCase , kebabCase |
🔢 Math | 数学计算 | clamp , random |
// 📱 响应式设计
useEventListener(
window,
'resize',
throttle(() => {
// 节流处理窗口缩放
updateLayout()
}, 300),
)
// 🖼️ 图片懒加载
useMutationObserver('.image-container', (mutations) => {
mutations.forEach((mutation) => {
// 自动处理新增的图片元素
lazyLoadImages(mutation.addedNodes)
})
})
// 🎪 动态表单
insertElement(
'.form-container',
createFormField({
type: 'input',
placeholder: '请输入内容',
}),
)
场景 | 原生 JS | Lazy JS Utils | 性能提升 |
---|---|---|---|
事件监听清理 | 手动管理 | 自动清理 | ⚡ 100% |
DOM 操作 | 10+ 行代码 | 1 行代码 | 🚀 90% |
内存使用 | 容易泄漏 | 智能管理 | 💾 80% |
![]() | ![]() | ![]() | ![]() |
---|---|---|---|
Chrome ✅ | Firefox ✅ | Safari ✅ | Edge ✅ |
我们欢迎任何形式的贡献!
MIT © 2024 Simon He
Built with ❤️ by Simon He
FAQs
A collection of lazy-loaded JavaScript utilities for efficient development
The npm package lazy-js-utils receives a total of 311 weekly downloads. As such, lazy-js-utils popularity was classified as not popular.
We found that lazy-js-utils demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
CVEForecast.org uses machine learning to project a record-breaking surge in vulnerability disclosures in 2025.
Security News
Browserslist-rs now uses static data to reduce binary size by over 1MB, improving memory use and performance for Rust-based frontend tools.
Research
Security News
Eight new malicious Firefox extensions impersonate games, steal OAuth tokens, hijack sessions, and exploit browser permissions to spy on users.