我们日常工作中虽然会遇到很多 BUG，我们也熟练掌握使用搜索引擎解决开发中的问题。但是当遇到线上 BUG 应该如何排查呢？我将我过往遇到的一些异常整理了出来，并将我遇到的干扰项以及问题点都做了详细记录。希望对你有所帮助排查路径确定是否变更导致？如果是变更导致需要及时回滚止损。非变更导致可以排查一下异常版本...

前几天被人问，「如何把元素固定在容器底部」。（本来想直接把 demo 地址给他，结果没找到，那么今天我们来补一下）Demo 地址想法&思路如果是页面底部，我们可以直接 position: fixed;bottom: 0; 基于浏览器定位直接实现。但是他要的效果是基于父级容器，那么我们必须要使用其他手段来定位了relative 来限制 absolute，...

最近有个项目（就叫他 P 项目）做了一次 UI 视觉统一。之前是个小项目用的是默认主题 theme-d ，这次需求还针对性的发布了一套 theme-p 主题。然后出事故了，更新了主题之后我们的 dialog 显示异常了。使用控制台查看样式通过查看样式我们发现都是 UI 的样式，并没有我们手动覆盖的样式。但是这里有一个异常点有四个生效...

节前碰到一个需求：「新人引导效果」针对第一次使用平台的用户进行主要功能引导。具体引导路径为：点击“新增按钮”，对弹出的内容进行解释，并引导用户填充表单，最后提交表单。

这是之前朋友问我的一个功能：他觉得看网页有时候注意力会被转移，希望可以有个蒙层帮助他集中注意力反手我就用 box-shadow 把功能写了出来。 {代码...} 因为 z-index 无法超过非 static 层级导致的 bug在我测试中发现了一些比较阴间的效果所以我们要小改动一下。直接给父级 ZIndex 全部提升。 {代码...} 因为 overflow ...

前两天北京下雪了，很冷。2022 招聘季，好像也比往年冷一些。2021 年 K12 的大量裁员，腾讯、快手、字节、滴滴、蘑菇街也在裁员。想要换工作的同学应该准备些什么呢？面试流程是什么样子的？如何应对面试呢？怎么样可以提高成功率？如果你关心上面的问题，并且你的目标位置不超出我的能力范围（高级工程师、阿里P6、字节...

Lighthouse 目前已经集成在新版本 Chrome DevTools 中，也可以将其作为一个 Chrome 扩展程序运行，或从命令行运行。

为什么我说 CDN 可以提速不全对？脱离剂量谈毒性,都是耍流氓（这里指脱离环境一把梭哈不现实） CDN 是指是什么？CDN 的全称是 Content Delivery Network，即内容分发网络。CDN 是构建在现有网络基础之上的智能虚拟网络，依靠部署在各地的边缘服务器，通过中心平台的负载均衡、内容分发、调度等功能模块，使用户就近获取...

因为 JS 精度问题 0.1 + 0.2 == 0.30000000000000004 ，可以不可以得出一个正确的值。0.1 + 0.2 == 0.3

哈喽，大家好又是我。昨天有个人在群里问：“基于 elementUI 如何实现拖动修改列宽度，并同步在多个表格中”。这个功能其实听常见的，在不同的使用者眼中关注点就应该是不一样的。比如：项目的主管，更关心进度前端开发，关心设计稿、接口什么时候提供后端开发，关心前端什么时候写完，什么时候联调测试人员，关心什么时候...

我们也想做一个展示我们设计稿（定宽，不定高）的页面，瀑布流是很棒的一种方案。瀑布流布局其核心是基于一个网格的布局，而且每行包含的项目列表高度是随机的（随着自己内容动态变化高度），同时每个项目列表呈堆栈形式排列，最为关键的是，堆栈之间彼此之间没有多余的间距差存大。还是上图来看看我们说的瀑布流布局是...

哈喽大家好啊。前半年还挺忙的，一直也没有发文章，有老哥想我了嘛。这两天发现老有人私信问我 PDF 相关的内容。那么好，为了我能安心摸鱼，我准备出一篇文章来介绍一下如何使用 PDFJS 。PDF.js 是什么？PDF.js 由 Mozilla 提供支持。目标是创建一个通用的、基于 Web 标准的平台，用于解析和呈现 PDF。预览 PDF使用 ifra...

一般用于审核后台，比如说要求图片在一定区间内才能加精。也用于在 canvas 中裁图时计算缩放比例。JS 获取图片宽高获取 naturalWidth（callback 版本）方案为获取 naturalWidth。那么 naturalWidth 和 width 有什么不同？naturalWidth 标识图片的原始宽高。width 因为历史问题，标识的其实是 DOM 元素宽高。因为 img 标...

我们一直解题的方案是根据一个顺口溜：一三五七八十腊，31天永不差，四六九十一，每月30天，惟有二月二十八，闰年要把日加一。（我搜的，具体怎么背我忘了）

今天面试了一个人，居然不知道如何将伪数组转换为数组？什么是伪数组？有 length 属性，而且也是数值下标的对象。不具备 Array.prototype 上的方法常见伪数组argumentsdocument.getElementsByClassName$('div')伪数组转换为数组输出伪数组 {代码...} 使用 Array.from （ES6+）（babel-polyfill） {代码...} 使用 ... 展...

小伙伴做的是实名认证（移动端）相关的功能，然后有个位置校验了只能输入数字。小伙伴发出了灵魂质疑：为什么 1. 没事 1.. 就被清空了？ 这个问题告诉我们喝一点没事，“一點點”不行。

把一个数表示成a与10的n次幂相乘的形式（1≤|a|<10，a不为分数形式，n为整数）。19971400000000 == 1.99714×10^13 == 1.99714e13

可以看到在我们使用 textarea 的时候，有时候需要感知内容的高度，然后动态撑开。（elementUI 的 textarea 就提供了 autosize 的功能。）

前端最基础的就是 HTML+CSS+Javascript。掌握了这三门技术就算入门，但也仅仅是入门，现在前端开发的定义已经远远不止这些。前端小课堂（HTML/CSS/JS），本着提升技术水平，打牢基础知识的中心思想，我们开课啦（每周四）。

前两天接到了一个需求：手机号、身份证、验证码 需要校验，检验规则包括长度、内容。想法是有一堆，但是不知道好使不好使，我们今天来整理一下咯。先来说说都有什么想法html 的标签属性typepatternmin、maxminlength、maxlengthjs 的事件监听value 获取值（vue 使用 v-model）@input 监听改变接下来就是我们大家都很期待...

前端 BUG 录 - 因 lodashjs debounce 去抖优化造成的 bug这两个 BUG 其实是同一个 BUG，怎么说呢？两个都没错，错就错在同时使用了。因为我没处理边界，导致我会给一个大数组排序，造成了卡顿。然后卡顿造成了节流时间成为了笑话。提问因为这个 BUG 其实有好几个限定条件才会触发，所以我先来提几个问题5000 条乱序的数...

正好这段时间内部在抽离常用组件，运营小姐姐最近迷上了飘屏功能，各种活动都要有个飘屏才罢休。然后就安排人抽离成组件了。结果这个组件在同一个位置绊倒了两个人，那么今天我们来分析一下。

做开发其实还是要考虑一下边界问题，因为边界问题有时候会导致体验断崖式的下跌。正好前段时间遇到了个问题，今天分享一下。之前做了一个 IM 的项目，是会话列表出现的问题：进入页面时，会加载会话列表，加载数据会造成卡顿。先说说我的逻辑：分页拉取本地历史数据（已读消息，userid排序的20个人）定时拉取远程数据（...

正好前段时间用 weex 做了一个页面，weex 天生基于 flex 。且 weex 中 flex-direction 默认值为 column，flex-direction 定义了 flex 容器中 flex 成员项的排列方向。

最近公司一直在做众审平台相关的功能，大多数还都和音视频有关，前端终究还是逃不过这一劫。疯狂遇到 BUG， 今天来说说其中一个：audio 加载时意外的长时间 Pending 问题。BUG 场景vue 框架移动端（android 和 ios 的兼容也挺坑，尤其是低版本）偶现（测试数据很难复现）资源是 cdn，存在海外节点。（意味着不是海外用户...

前段时间写了一个上传文件前预览的功能，用于 pc 端。这次又要测试一下移动端的兼容性，在客户端内使用。正好整理一下，先上测试地址：DEMO 地址，目前有这些功能。动态设置 accept、capture、multiple、webkitdirectory?accept=.png 的形式快速还原场景上传前预览的功能，前端上传前预览文件 image、text、json、video...

因为疫情，所有学校都放假了（从寒假到暑假，我也想要啊）云合影、云毕业照、人脸融合成了热点名词，咱们也来凑凑热闹（demo 代码大概六月份就写了，一直没整理内容，现在成了吃冷饭了）

正好回答了一个问题，浏览器哪个事件里可以 禁止 浏览器对title显示默认行为？ 。今天整理一下相关的测试 demo。分析问题先找一下关键词，从里面找一下解决问题的思路。ssrtitle默认行为seo自定义 tooltip 行为解决问题阻止浏览器默认行为（失败了）event.preventDefault() 可以用来阻止浏览器的默认行为，比如说 onsubm...

前端最基础的就是 HTML+CSS+Javascript。掌握了这三门技术就算入门，但也仅仅是入门，现在前端开发的定义已经远远不止这些。前端小课堂（HTML/CSS/JS），本着提升技术水平，打牢基础知识的中心思想，我们开课啦（每周四）。

前端最基础的就是 HTML+CSS+Javascript。掌握了这三门技术就算入门，但也仅仅是入门，现在前端开发的定义已经远远不止这些。前端小课堂（HTML/CSS/JS），本着提升技术水平，打牢基础知识的中心思想，我们开课啦（每周四）。