随笔分类 - 前端技术
摘要：
一个复杂的 Chrome 扩展程序通常由 `content_scripts`，`background`，`action popup`，`side panel`，`options page`，`devtools` 等部分组成，这些部分所负责的功能各不相同，所处的运行环境各不相同，所能访问的 `chrome.*` API 也各不相同，也因此经常需要通信告诉对方需要做什么。
阅读全文
一个复杂的 Chrome 扩展程序通常由 `content_scripts`，`background`，`action popup`，`side panel`，`options page`，`devtools` 等部分组成，这些部分所负责的功能各不相同，所处的运行环境各不相同，所能访问的 `chrome.*` API 也各不相同，也因此经常需要通信告诉对方需要做什么。
阅读全文
摘要：
基于 Chromium 的浏览器占了全球市场的 7 成！对于前端开发来说，Chrome 更是形影不离的饭碗级软件 😁。既然 Chrome 这么重要，那么把它研究透一定大有裨益。在我看来，Chrome 值得深入研究的地方有两块：DevTools 和 Extension。
阅读全文
基于 Chromium 的浏览器占了全球市场的 7 成！对于前端开发来说，Chrome 更是形影不离的饭碗级软件 😁。既然 Chrome 这么重要，那么把它研究透一定大有裨益。在我看来，Chrome 值得深入研究的地方有两块：DevTools 和 Extension。
阅读全文
摘要：
工欲善其事，必先利其器。Chrome 可能是前端开发中使用最多的浏览器。在日常开发中，下列几款 Chrome 扩展也许能让你的开发工作事半功倍 🚀
阅读全文
工欲善其事，必先利其器。Chrome 可能是前端开发中使用最多的浏览器。在日常开发中，下列几款 Chrome 扩展也许能让你的开发工作事半功倍 🚀
阅读全文
摘要：
Chrome 扩展项目使用前端 html，css，js 基础技术开发，一大痛点就是改动代码后的扩展更新问题。仔细想想想，目前前端项目开发已经有 HMR 热重载技术，在开发 Web 页面时可以实时查看效果，极大的提升了开发体验。那么，能否把这种极致的体验带到 Chrome 扩展开发中来呢？经过多番折腾探索，还真让我搞出来啦 🚀
阅读全文
Chrome 扩展项目使用前端 html，css，js 基础技术开发，一大痛点就是改动代码后的扩展更新问题。仔细想想想，目前前端项目开发已经有 HMR 热重载技术，在开发 Web 页面时可以实时查看效果，极大的提升了开发体验。那么，能否把这种极致的体验带到 Chrome 扩展开发中来呢？经过多番折腾探索，还真让我搞出来啦 🚀
阅读全文
摘要：
大家好，我是 dom 哥。这是我关于 Chrome 扩展开发的系列文章，本篇接着说剩下的 manifest 可选字段。
阅读全文
大家好，我是 dom 哥。这是我关于 Chrome 扩展开发的系列文章，本篇接着说剩下的 manifest 可选字段。
阅读全文
摘要：
填表单是打工人经常面对的场景，作为一个前端，我经常开发一些PC端的页面，它们主要由表单和表格构成，而输入框又是表单里最常见的表单项。接下来就试着做一个简单的小扩展，用于快速给表单里的输入框填充值。
阅读全文
填表单是打工人经常面对的场景，作为一个前端，我经常开发一些PC端的页面，它们主要由表单和表格构成，而输入框又是表单里最常见的表单项。接下来就试着做一个简单的小扩展，用于快速给表单里的输入框填充值。
阅读全文
摘要：
在 Chrome 扩展开发中，manifest 文件是项目的核心，其中 "content_scripts"，"background"，"permissions" 配置项又至关重要！
阅读全文
在 Chrome 扩展开发中，manifest 文件是项目的核心，其中 "content_scripts"，"background"，"permissions" 配置项又至关重要！
阅读全文
摘要：
Chrome 在全球浏览器市场份额独占 6 成，无论是对普通用户还是开发者，都是电脑里的必备利器。Chrome 无论是在性能还是 UI 交互方面都非常出色，而 Chrome 扩展则为开发者提供了接口，让开发者有能力自己编写代码使自己的 Chrome 更强大，更加定制化。
阅读全文
Chrome 在全球浏览器市场份额独占 6 成，无论是对普通用户还是开发者，都是电脑里的必备利器。Chrome 无论是在性能还是 UI 交互方面都非常出色，而 Chrome 扩展则为开发者提供了接口，让开发者有能力自己编写代码使自己的 Chrome 更强大，更加定制化。
阅读全文
摘要：
有很多 Web 编辑器支持直接复制粘贴图片，记录一下这种效果是怎么实现的：只需要3步，# 拿到粘贴板上的 image file 对象，## 上传图片，### 插回输入框
阅读全文
有很多 Web 编辑器支持直接复制粘贴图片，记录一下这种效果是怎么实现的：只需要3步，# 拿到粘贴板上的 image file 对象，## 上传图片，### 插回输入框
阅读全文
摘要：
大家好，我是DOM哥。我用 ChatGPT 开发了一个 Vue 的资源导航网站。不管你是资深 Vue 用户，还是刚入门想学习 Vue 的小白，这个网站都能帮助到你。网站地址：https://dombro.site/vue#/vue
阅读全文
大家好，我是DOM哥。我用 ChatGPT 开发了一个 Vue 的资源导航网站。不管你是资深 Vue 用户，还是刚入门想学习 Vue 的小白，这个网站都能帮助到你。网站地址：https://dombro.site/vue#/vue
阅读全文
摘要：传统的客户端和服务器通信协议是HTTP：客户端发起请求，服务端进行响应，服务端从不主动勾搭客户端。这种模式有个明显软肋，就是同步状态。而实际应用中有大量需要客户端和服务器实时同步状态的场景，比如聊天室、股票行情、在线共享文档等都需要客户端实时拿到服务器的最新状态。socket.io 是一个类库，内部封装了WebSocket，可以在浏览器与服务器之间建立实时通信。
阅读全文
摘要：作为开源世界最优秀的作品之一，Git已经成为目前进行项目版本控制的最佳方案，也逐渐成为程序员必备的基础技能。我在这里总结了日常开发中最常用到的10余条git命令，并且通过命令行别名的方式做到敲一个键就能执行它们。
阅读全文
摘要：话说印度研发了最新款的智能机器人，代号“七弟”，用于执行特殊任务。 由于开发者的大意疏忽，七弟的内核程序中存在一个隐晦的bug：当周围播放电子音乐时，电子音乐中强烈且带节奏的声波会影响七弟周围的空气密度，进而干扰里面电子元件的电容电压值，当电容释放时会执行一段固定的步行程序。但是电音中的节拍时长限制
阅读全文
摘要：这是一份详细的小程序各特性各端真机调研对比报告
阅读全文
摘要：开始的开始，简单粗暴。在微信小程序里，一行 wx.getUserInfo 即可弹窗用户授权登陆。大部分小程序图省事，直接在打开小程序的时候就调这个方法。所以那时候一个印象就是随便打开一个小程序，进去就是弹窗让我登陆，想拿我的微信信息，给人一种不安全的感觉。
阅读全文
摘要：微信小程序的出现极大地降低了个人开发者微创业的门槛，不需要后端技术，不需要服务器和域名这些乱七八糟的前置操作，只需要懂得前端技术，就能发布一款属于自己的轻量级应用，简直是前端开发者的福音呐😁
阅读全文
摘要：某些手机上 fixed 元素在页面滚动时会消失，某些 IOS 设备上触发不了点击事件，IOS 设备上点击事件有 300ms 延迟，IOS 设备上 fixed 元素在键盘弹起时位置会变幻不定，在弹窗上滑动时底部页面也跟着动，两年移动端前端开发，我TM都经历了什么
阅读全文
摘要：【楼层定位】是前端日常开发中的常见需求。这个效果本身并没有什么高深的地方，不出意外的话，一般 Jser 在几十分钟之内就能搞出来一个。但如果把兼容性考虑进去，那情况就要复杂多了。尤其是移动端的兼容性，UI 表现不一致，scroll 事件触发不连续，blabla...。在经过一次实现这种需求的痛苦经历后，咱决心搞一个插件出来，不让前端的小伙伴们再被各种兼容性问题恶心到。
阅读全文
摘要：前端朋友们，今天要介绍的这款小点心牛B了。相信每个前端都应该接触过这种效果，而且是非常流行的交互。这种弹窗的使用场景主要出现在移动端。为了以后不必再为写这种效果烦心，特此写了【底部浮现弹窗】小插件。
阅读全文
摘要：小点心，顾名思义，开箱即食，拿来即用。弹窗就无需多说了，几乎所有存在交互的页面都会用到，一个页面上甚至会有 N 多个弹窗。弹弹弹，弹出鱼尾纹。如果从面向对象的角度去看，把弹窗看成一个类想必是极好的，与之绑定的DOM块是它的属性，打开和关闭是它的方法，而且这样可以实现弹窗样式和逻辑的分离。
阅读全文
