- 博客(24)
- 收藏
- 关注
RSS订阅原创 面试题·前端多端适配方案：如何智能跳转移动端和PC端项目
方案适用场景实现难度SEO友好用户体验纯前端跳转静态网站⭐⭐❌可能有闪烁服务端跳转企业级应用⭐⭐⭐✅最佳响应式设计差异小的项目⭐⭐✅流畅子域名方案大型网站⭐⭐⭐⭐✅清晰分离如果你的项目对SEO和加载速度要求高，推荐服务端跳转（Nginx/Node.js）；如果是小型项目，纯前端跳转或响应式设计可能更简单。希望这篇博客能帮你选择合适的前端多端适配方案！
2025-06-03 18:20:07
179
原创 前端面试题：如果列表渲染几十万条数据，页面卡顿怎么办？你会用什么实际方案来优化
面试官还追问了“假如虚拟列表不能用怎么办”，说可以手写个简版的：监听 scroll，计算可视区域下标，只渲染那一部分 dom。用法就是把原本的 v-for 换成虚拟列表组件，props 传数据和 itemSize 即可，代码改动量小，体验提升大。Vue2 项目用 vue-virtual-scroll-list，Vue3 可以用 element-plus 的。大型行内复杂组件可以单独拆开，只传递必须的数据，防止数据变动带来无关重渲。ElVirtualList，或者直接用 vant 的 虚拟列表。
2025-05-29 17:41:04
342
原创 前端面试题：请简要说明 Vue2 中 Vuex 与 Vue3 中 Pinia 的区别，以及你更推荐哪一个？为什么？
其实 Pinia 可以理解为官方在 Vue3 时代推出的“新一代状态管理”，它解决了 Vuex 里很多啰嗦的写法。写法简洁：Pinia 直接在 action 里改 state，不用 mutation 了，少写不少模板代码。TS 支持更好：Pinia 用 TypeScript 很舒服，类型推断到位，开发体验好，Vuex 用 TS 写多了就挺烦的。和 Vue3 搭配更自然：Pinia 完全支持 Composition API，setup 里直接用 store，很方便。
2025-05-29 17:32:26
311
原创 面试题·如何计算白屏时间
测量白屏时间，既能帮助你定位性能瓶颈，也能为你优化页面加载体验提供数据支撑。动手加个埋点吧，产品体验就是这样一点点被你打磨出来的！
2025-05-28 10:01:27
611
原创 AI编程cursor配置中文（简单）
使用快捷键组合【Ctrl+Shift+p】，在搜索框中输入configure display language,选择中文也可配置中文，配置后重启一下就好了。
2025-05-28 09:41:59
186
原创 用好 console 的“进阶玩法”
本文介绍了console对象的8种进阶用法，帮助开发者提升调试效率，这些方法能让调试过程更清晰高效，建议开发者掌握这些技巧来优化调试体验。
2025-05-26 11:37:26
418
原创 前端页面卡顿？5个你必须掌握的性能优化技巧！（含原理与代码详解）
本文分享了5个解决前端页面卡顿的性能优化技巧每个技巧都配有原理解析和代码示例，涵盖Vue、React等技术栈的实现方式。这些优化手段能有效提升页面响应速度和用户体验，适合在实际项目中灵活应用。文章还鼓励开发者持续积累性能优化经验，针对不同场景选择合适方案。
2025-05-26 11:25:39
770
原创 JS使用 Wake Lock API 防止屏幕休眠
Wake Lock API 是一个相对较新的 Web API，它允许网页在需要时请求设备保持屏幕常亮，防止休眠。这在播放视频、阅读长文、执行任务时非常有用。释放屏幕常亮（Wake Lock），你只需要调用 wakeLock.release()，然后把 wakeLock 设为 null 即可。
2025-05-22 20:42:28
164
原创 JavaScript 密码强度校验方法：支持数字、大小写字母和特殊字符
密码强度校验是注册和登录流程中不可或缺的功能。本文分享了一种简洁高效的 JavaScript 方法，通过校验数字、小写字母、大写字母和特殊字符，快速评估密码的强度等级。代码采用现代化写法，优化可读性和维护性，并附详细的示例，适合各种前端场景
2025-02-08 15:47:23
345
原创 5 种 JavaScript 数组去重方法，支持基本类型和对象数组
数组去重是 JavaScript 开发中常见的需求，不同场景下有不同的实现方式。本文总结了 5 种常用的数组去重方法，包括 Set 适用于基本类型的数据去重，以及 Map 实现的对象数组去重方案，确保数据处理高效、简洁。适合各种开发需求，提升代码质量。
2025-02-08 15:12:17
150
原创 uni-app 全平台图片压缩：H5 & App 端兼容方案（支持跨域）
在 uni-app 开发中，图片压缩是提升用户体验和优化性能的重要手段。本文提供了一种 兼容 H5 和 App 端的图片压缩方法，在 App 端使用 uni.compressImage 进行高效压缩，而在 H5 端利用 canvas 进行图片缩放压缩，并 支持跨域处理。文章不仅优化了 toDataURL 生成 JPEG 以减少文件大小，还修正了 clearRect 误用问题，并添加了错误处理机制，确保代码在各种情况下都能稳定运行。适用于 uni-app 全平台开发。
2025-02-08 14:53:21
491
原创 格式化时间戳为指定格式的日期字符串
在前端开发中，经常需要将时间戳转换为可读的日期格式。本文介绍了一个 JavaScript 方法 formatTimestamp，用于格式化时间戳为指定格式的日期字符串。该方法支持自定义日期格式，如 "yyyy-mm-dd"、"yyyy/mm/dd hh:ii:ss" 等，确保日期始终以两位数显示。文章还提供了示例代码，帮助开发者快速集成该方法到项目中，提高代码的可读性与可维护性。
2025-02-08 14:46:46
306
原创 浏览器全屏/取消全屏/判断浏览器是否全屏
//页面全屏 function fullScreen(){ var el = document.documentElement; var rfs = el.requestFullScreen || el.webkitRequestFullScreen || el.mozRequestFullScreen || el.msRequestFullScreen; if (rfs) { rfs.call(el); }
2022-03-14 18:04:38
1506
原创 修改链接上制定字段参数
function changeURLArg(url, arg, arg_val) { /** * url地址修改 * @param url 待修改url * @param arg 修改的参数名 * @param arg_val 修改的具体值 * @returns {String} */ var pattern = arg + "=([^&]*)"; var replaceText
2022-03-03 17:24:06
149
原创 简单封装WebSocket
封装成函数function createSocket(url,msg){ return new Promise(function(resolve, reject){ const socket = new WebSocket(url) socket.onopen = () => { socket.send(JSON.stringify(msg)) setTimeout(()=>{ //当服务未回应时，判断so
2020-12-29 14:03:10
413
1
原创 闭包总结
闭包如果让我们去开发一个银行账户的系统，账户的钱应该怎么用程序实现呢？首先想到，应该存在变量中。然后我们可以访问到这个变量的值（查询余额）、进行加法运行（存钱）、减法运算（取钱） var money=100;//存 console.log(money); //查 money-=10;//花是很方便，但问题也随之而来：全局中的变量是不安全的，容易被覆盖，任意被攻击，...
2020-03-27 19:32:38
194
原创 JS设计模式总结（单例模式/组合模式/观察者模式）
设计模式设计模式的概念：为了解决某种问题，而设计的一套最佳解决方案。常见的设计模式：单例模式组合模式观察者模式命令模式代理模式工厂模式策略模式适配器模式等等单例模式如果一个类创建出许多对象，里面所有的属性和方法都一模一样，或封装一个类，将一些常用的操作函数的方法放进去，每次都是用同一个对象来调用这些方法。正常情况下，一个类创建出来的每个对象都是不一样的； fun...
2020-03-26 16:31:32
354
原创 JS鼠标第一次点击执行事件A再次点击执行事件B
页面打开的样式点击开始后，秒表开始运动，开始按钮上的文字变为重置，点击重置，秒表也会重置；点击暂停，秒表暂停，文字变为继续，点击继续按钮，秒表继续运动；<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport...
2020-03-16 10:47:53
2080
原创 JavaScript正则表达式总结
正则表达式每种数据都有自己的规则，正则表达式可以描述这个规则，也可以检测数据是否满足这个规则。所以正则表达式就是专门用来校验数据而产生的语法，有如下几个作用；校验数据提取数据替换数据创建正则表达式JS中提供两种创建正则表达式的方法，字面量方式、构造函数方式/*字面量方式：var reg=/规则/*/ var reg=/\d/; //\d是正则表达式中的元字符 用...
2020-03-14 18:36:00
1102
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人