一、CSS 1.说一下CSS的盒模型。 在HTML页面中的所有元素都可以看成是一个盒子 盒子的组成：内容content、内边距padding、边框border、外边距margin 盒模型的类型： 标准盒模型 margin + border + padding + content IE盒模型 marg ...

一、qiankun使用场景 1. 简介：qiankun是在single-spa的基础上实现的，可以保证各个项目独立使用，也可以集成使用。各系统之间不受技术栈的限制，集成使用也能保证各样式和全局变量的隔离。 模块的插拔式使用，当公司项目集是一个大系统下包含多个子系统或者模块时，可以采用这种方式动态部署 ...

问题 部分的组件库（例如antd）使用到了window.innerWidth和window.innerHeight属性，可无界框架在初始化时仅将主应用的innerWidth和innerHeight属性赋值给子应用，后续不管主应用如何变化，子应用的这两个属性无法跟随变化，也就导致子应用使用的这些组件库 ...

基于 Chromium 的浏览器占了全球市场的 7 成！对于前端开发来说，Chrome 更是形影不离的饭碗级软件 。既然 Chrome 这么重要，那么把它研究透一定大有裨益。在我看来，Chrome 值得深入研究的地方有两块：DevTools 和 Extension。 ...

这里给大家分享我在网上总结出来的一些知识，希望对大家有所帮助 太长不看 不要嵌套使用函数。给每个函数命名并把他们放在你代码的顶层 利用函数提升。先使用后声明。 处理每一个异常 编写可以复用的函数，并把他们封装成一个模块 什么是“回调地狱”？ 异步Javascript代码，或者说使用callback的 ...

前言 ECMAScript 2023 引入了一些新功能，以改进语言并使其更加强大和无缝。这个新版本带来了令人兴奋的功能和新的 JavaScript 数组方法，使使用 JavaScript 编程更加愉快和轻松。本文将带领读者全面了解 JavaScript 数组原型上的新方法。 什么是ECMAScrip ...

CLS 衡量的是页面的整个生命周期内发生的每次意外布局偏移的最大突发性_布局偏移分数_。布局变化的发生是因为浏览器倾向于异步加载页面元素。更重要的是，您的页面上可能存在一些初始尺寸未知的媒体元素。这种组合意味着浏览器在加载完成之前无法确定单个元素将占用多少空间。因此，这种不确定性带来的剧烈布局转变就... ...

工欲善其事，必先利其器。Chrome 可能是前端开发中使用最多的浏览器。在日常开发中，下列几款 Chrome 扩展也许能让你的开发工作事半功倍 ...

Chrome 扩展项目使用前端 html，css，js 基础技术开发，一大痛点就是改动代码后的扩展更新问题。仔细想想想，目前前端项目开发已经有 HMR 热重载技术，在开发 Web 页面时可以实时查看效果，极大的提升了开发体验。那么，能否把这种极致的体验带到 Chrome 扩展开发中来呢？经过多番折腾... ...

大家好，我是 dom 哥。这是我关于 Chrome 扩展开发的系列文章，感兴趣的可以 点个小星星。 在上篇和中篇中已经完成了对 manifest 文件中以下字段的解释： "manifest_version" "name" "version" "description" "icons" "conten ...

单例模式（Singleton Pattern）是最简单的设计模式之一。这种类型的设计模式属于创建型模式，提供了一种创建对象的最佳方式。主要在想控制实例数目，节省系统资源的时候应用。 ...

哈喽！大家好！我是程序视点的小二哥。 前端开发中，总会遇到这样一个困境：动画还原。对于前端开发工程师，有的是这样做的。 照着设计动画模仿，猜测动画时长，手创建贝塞尔曲线…… 调整细节耗时耗力，效果还差强人意... 好不容易实现了，还原度却达不到要求 在被UI设计折磨一顿后，小二哥找到了解决这个困境的 ...

填表单是打工人经常面对的场景，作为一个前端，我经常开发一些PC端的页面，它们主要由表单和表格构成，而输入框又是表单里最常见的表单项。接下来就试着做一个简单的小扩展，用于快速给表单里的输入框填充值。 ...

这里给大家分享我在网上总结出来的一些知识，希望对大家有所帮助 DOM小练习 弹幕 电梯导航 倒计时 随机点名 购物放大镜 1.弹幕 效果预览 功能：输入弹幕内容，按下回车显示一条弹幕（弹幕颜色、字体随机生成） 思路：设置按钮抬起事件，在事件中判断如果按下的是回车键则将输入框中替换掉敏感词的数据追加到 ...

在 Chrome 扩展开发中，manifest 文件是项目的核心，其中 "content_scripts"，"background"，"permissions" 配置项又至关重要！ ...

Chrome 在全球浏览器市场份额独占 6 成，无论是对普通用户还是开发者，都是电脑里的必备利器。Chrome 无论是在性能还是 UI 交互方面都非常出色，而 Chrome 扩展则为开发者提供了接口，让开发者有能力自己编写代码使自己的 Chrome 更强大，更加定制化。 ...

介绍 在使用nest创建项目时,默认使用webpack进行打包,有时候启动项目需要1-2分钟。所以希望采用vite进行快速启动项目进行开发。 本文主要使用NestJs、Vite和swc进行配置。文章实操较多，概念性的东西可访问对应的官方文档进行了解。tips: 个人认为概念性的东西,在文章中指出。对 ...

在TypeScript中，Omit<Type, Keys> 是一个工具类型（utility type），它用于创建一个新的类型，这个新类型是从现有类型（Type）中排除了某些指定的属性（Keys）后的结果。 具体来说，Omit<User, "token"> 表示创建一个新的类型，这个类型包含了 Us ...

实现原理是使用TWEEN.Tween实现动画效果 实现 汽车模型加载 使用Promise编写模型的异步加载方法 参数position是汽车初始位置，参数rotation是汽车初始朝向 Car.prototype.loadCar = function (position, rotation) { le ...

上一章讲完如何获取用户信息授权 后，下一步就可以进行小程序支付了。 本期就来介绍下支付宝小程序支付如何实现。 PS：接入前的准备工作可以参考：接入准备；接入指南可参考：接入指南～ 获取小程序支付权限 获取权限分为三步：分别是 账号开通 JSAPI 支付、账号与小程序账号绑定 以及 小程序绑定 JSA ...