vue知识分享 - 随笔分类 - 林恒

摘要：

🧑‍💻 写在开头点赞 + 收藏学会🤣🤣🤣 Vue 实战：纯前端生成带中心 Logo 二维码的分享海报在日常的 Web 业务中，经常会遇到“点击分享，生成一张包含用户信息、业务数据以及专属二维码的海报图”的需求。为了节省服务端资源，我们通常会采用纯前端的方案来完成海报的绘制与下载。本阅读全文

posted @ 2026-09-29 15:20 林恒阅读(43) 评论(0) 推荐(0)

面试官：我为什么总在浏览器存储问题上追问IndexedDB？

摘要：

🧑‍💻 写在开头点赞 + 收藏学会🤣🤣🤣 前言面试官：“聊聊浏览器存储吧。” 我：“Cookie, LocalStorage...” 面试官：“然后呢？IndexedDB 了解吗？” 我：“...” 作为一名前端面试官，我有一个“压箱底”的问题，它像一面镜子，能清晰地照出一位候选人的阅读全文

posted @ 2026-09-18 16:38 林恒阅读(46) 评论(0) 推荐(0)

纯前端生成海报下载方案

摘要：

🧑‍💻 写在开头点赞 + 收藏学会🤣🤣🤣 Vue 实战：纯前端生成带中心 Logo 二维码的分享海报在日常的 Web 业务中，经常会遇到“点击分享，生成一张包含用户信息、业务数据以及专属二维码的海报图”的需求。为了节省服务端资源，我们通常会采用纯前端的方案来完成海报的绘制与下载。本阅读全文

posted @ 2026-09-10 14:26 林恒阅读(63) 评论(0) 推荐(0)

App 内嵌 H5 秒开技术方案

摘要：

🧑‍💻 写在开头点赞 + 收藏学会🤣🤣🤣 一、背景与目标 1.1 什么是"秒开" App 内嵌 H5 的"秒开"指用户点击后，H5 页面在毫秒级（理想 < 300ms）内完成首屏渲染，用户感知不到明显的白屏或加载过程，体验接近 Native 页面切换。 1.2 为什么 H5 加载慢阅读全文

posted @ 2026-09-02 16:44 林恒阅读(64) 评论(0) 推荐(0)

我是怎么把页面图片流量砍掉一半的

摘要：

🧑‍💻 写在开头点赞 + 收藏学会🤣🤣🤣 个月接到一个需求，产品说"首页加载太慢了，能不能优化一下"。我打开 Network 面板一看——光图片请求就占了整个页面流量的 70%，最大的一张 PNG 图标居然有 380 多 KB。我当时就觉得，这不是优化问题，这是没做优化。花了两天时阅读全文

posted @ 2026-08-28 17:58 林恒阅读(58) 评论(0) 推荐(0)

前端手机号脱敏的 4 个层级，你在第几层？

摘要：

🧑‍💻 写在开头点赞 + 收藏学会🤣🤣🤣 前言：一个 Code Review 的 comment 上周提交了一个需求：用户手机号在列表页需要脱敏展示。我随手写了这么一段： function maskPhone(phone) { return phone.replace(/(\d{3}) 阅读全文

posted @ 2026-08-26 16:39 林恒阅读(67) 评论(0) 推荐(0)

前端如何实现在线预览office常见文件功能？

摘要：

🧑‍💻 写在开头点赞 + 收藏学会🤣🤣🤣 前言最近发现了一个在线预览附件功能，相信大多数前端都不陌生，刚开始我就一顿操作，下载pdf.js/pptx.js/vue-office,但是不太友好，我发现怎么弄都不支持.doc和.xls后缀名的文件，然而，一个偶然的机会，我发现了一个非常不阅读全文

posted @ 2026-08-24 18:35 林恒阅读(56) 评论(0) 推荐(0)

🔔 如何实现一个优雅的通知中心？（Vue 3 + 消息队列实战）

摘要：

🧑‍💻 写在开头点赞 + 收藏学会🤣🤣🤣 前言一个完善的通知系统可以显著提升用户体验，让用户及时了解：新评论回复文章被点赞系统公告签到奖励今天分享如何实现一个优雅的通知中心！功能设计通知类型 // src/types/notification.ts export typ 阅读全文

posted @ 2026-08-14 18:08 林恒阅读(56) 评论(0) 推荐(0)

如何使用GSAP实现一个 `pinned` 滚动楼层叙事？

摘要：

🧑‍💻 写在开头点赞 + 收藏学会🤣🤣🤣 准备工作技术栈： vue + gsap 最近在做的一个动画，特意去网上查了一下叫 pinned 滚动叙事，感觉蛮有趣，分享给你们。实现的动画如下：对应的模仿网址是：www.vaporesso.com/series-prod… 思考过程🤔 阅读全文

posted @ 2026-08-11 18:16 林恒阅读(49) 评论(0) 推荐(0)

纯前端生成海报下载方案

摘要：

🧑‍💻 写在开头点赞 + 收藏学会🤣🤣🤣 Vue 实战：纯前端生成带中心 Logo 二维码的分享海报在日常的 Web 业务中，经常会遇到“点击分享，生成一张包含用户信息、业务数据以及专属二维码的海报图”的需求。为了节省服务端资源，我们通常会采用纯前端的方案来完成海报的绘制与下载。本阅读全文

posted @ 2026-08-06 14:20 林恒阅读(91) 评论(0) 推荐(0)

侧边栏收起缩放适配方案

摘要：

🧑‍💻 写在开头点赞 + 收藏学会🤣🤣🤣 一、问题描述在 OverallProcurementDashboard 和 OrderDataPanel 两个大屏看板页面中，使用 CSS scale 缩放方案来适配不同屏幕尺寸。当用户点击收起左侧菜单栏时，会出现以下两个问题：竖向滚动条出阅读全文

posted @ 2026-07-29 17:58 林恒阅读(84) 评论(0) 推荐(0)

vue对接海康摄像头-H5player

摘要：

🧑‍💻 写在开头点赞 + 收藏学会🤣🤣🤣 1.在public中放入js 视口大小 init() { // 设置播放容器的宽高并监听窗口大小变化 window.addEventListener("resize", () => { this.player.JS_Resize(); }); 阅读全文

posted @ 2026-07-24 17:39 林恒阅读(88) 评论(0) 推荐(1)

Vue3 大屏适配组件（Scale / Rem 双方案一键切换）

摘要：

🧑‍💻 写在开头点赞 + 收藏学会🤣🤣🤣 一键切换「整体 Scale 缩放」「Rem 等分适配」窗口自动监听 resize 适配设计稿 1920*1080 Vue3 全局直接引入用一、新建组件 ScreenAdapter.vue <template> <div class="scr 阅读全文

posted @ 2026-07-21 17:33 林恒阅读(89) 评论(2) 推荐(0)

你点的“刷新”是假刷新？前端路由的瞒天过海术

摘要：

🧑‍💻 写在开头点赞 + 收藏学会🤣🤣🤣 为什么单页应用切换页面时，浏览器没有真正刷新？地址栏变了，页面却没白一下？今天我们来拆穿前端路由的“魔术”——它根本没去服务器要新页面，而是自己偷偷换了内容。看完这篇，你也能实现一个自己的前端路由。前言你有没有注意过，现在很多网站（比如知乎阅读全文

posted @ 2026-07-17 18:28 林恒阅读(71) 评论(0) 推荐(0)

短链跳转

摘要：

🧑‍💻 写在开头点赞 + 收藏学会🤣🤣🤣 短链跳转短链服务（服务端/运维负责）：短链（如 s.xxx.com/abc123）本身只是一个入口。当用户在浏览器访问短链时，DNS会将其指向短链服务器，短链服务器会通过 HTTP 302 重定向，将用户的浏览器跳转到真实的长链地址（如 ap 阅读全文

posted @ 2026-07-14 17:55 林恒阅读(97) 评论(0) 推荐(0)

Threejs实现 3D 看房效果

摘要：

🧑‍💻 写在开头点赞 + 收藏学会🤣🤣🤣 要实现一个 3D 看房效果，可以使用 Three.js 创建一个虚拟的 3D 场景，并通过加载全景图片或 3D 模型来模拟房间的外观。以下是一个完整的实现方案，结合代码逐步讲解如何实现这一功能。实现步骤创建基础场景和相机使用 Three. 阅读全文

posted @ 2026-07-13 17:32 林恒阅读(129) 评论(0) 推荐(0)

录音与音频可视化

摘要：

🧑‍💻 写在开头点赞 + 收藏学会🤣🤣🤣 需求背景实现效果现在很多AI智能体应用，会向用户开放自定义音色的功能，以便用户能使用自己的声音生成一个角色。实现自定义音色的前提就是采集用户自己的声音，以供后续大模型生成角色的自定义音色。本文将介绍，怎么在web中实现录音以及音频的可视化。阅读全文

posted @ 2026-07-09 18:12 林恒阅读(121) 评论(0) 推荐(0)

纯前端生成海报下载方案

摘要：

🧑‍💻 写在开头点赞 + 收藏学会🤣🤣🤣 Vue 实战：纯前端生成带中心 Logo 二维码的分享海报在日常的 Web 业务中，经常会遇到“点击分享，生成一张包含用户信息、业务数据以及专属二维码的海报图”的需求。为了节省服务端资源，我们通常会采用纯前端的方案来完成海报的绘制与下载。本阅读全文

posted @ 2026-07-08 15:47 林恒阅读(90) 评论(0) 推荐(0)

Three.js 3D 地图特效与材质实现指南

摘要：

🧑‍💻 写在开头点赞 + 收藏学会🤣🤣🤣 一、地形材质（MeshStandardMaterial） 1.1 实现原理使用 Three.js 的 PBR（物理正确渲染）材质，结合多张纹理实现真实感地形效果：漫反射纹理（diffuseMap）：控制表面颜色位移纹理（displacem 阅读全文

posted @ 2026-07-03 15:18 林恒阅读(88) 评论(0) 推荐(0)

App 内嵌 H5 秒开技术方案

摘要：

🧑‍💻 写在开头点赞 + 收藏学会🤣🤣🤣 一、背景与目标 1.1 什么是"秒开" App 内嵌 H5 的"秒开"指用户点击后，H5 页面在毫秒级（理想 < 300ms）内完成首屏渲染，用户感知不到明显的白屏或加载过程，体验接近 Native 页面切换。 1.2 为什么 H5 加载慢阅读全文

posted @ 2026-07-02 18:13 林恒阅读(130) 评论(0) 推荐(0)

林恒

随笔分类 - vue知识分享

公告