全部文章

无限试用GitLens的方案

最近看到GitLens这个插件，试了下，感觉极好。但是付费提示很烦，这极不好。 查了下，看到GitLens是以MIT协议开源的，那么有没有可能无限试用这个插件？ 开干！ 首先clone一下整个项目： 下载node.js（目前项目推荐为node18）并暂时加入PoweShell路径（建议管理员模式执行以防止报错）： 如果你网络不佳，可以： 安装yarn： 切换到先前clone的文件夹，并执行： 我这里报错Sharp这个模块装不上报无法解决...

Git Worktree 的使用

官方介绍地址： 对于 git worktree 的使用场景，我们举个例子说明。 如果我们正在进行重构代码，老板突然要求我们立即修复某些问题。通常我们可能会使用 git stash 来临时存储相关更改，但是此时工作树会处于这样一种混乱状态(有新增的、被移动的、被删除的文件，以及其他的修改)。一个不注意，我们就会打乱 git stash 中的文件，此时我们原本的修改或者 Git 管理有可能就会出现问题。 如果我们希望在不影响现有更改的前提下...

nextjs使用unocss

CSS | 是时候学习 Grid 布局了

在前端开发中，创建灵活且响应式的布局是非常重要的。为了实现这一目标，Grid 网格布局成为了一种强大的工具。它提供了一种直观且灵活的方式来构建网页布局，本文将从Grid的基本概念入手，介绍Grid网格布局中的常用属性和功能。那么下面我们一起来探索这个强大且灵活的布局方式吧！ Flex布局是一维的排版方式，也就是说一次只能控制一个方向（水平方向或者垂直方向），如果需要控制另一个方向需要再添加一层flexbox容器。 Grid布局是二维的排...

requestIdleCallback解决页面卡顿

一、基本概念 1. js是单线程执行的，分为GUI渲染线程，js引擎线程，事件触发线程，定时器触发器线程，http请求线程。 2. 执行js会阻塞gui渲染，如js执行所需时间超过一帧的时间，就会导致页面掉帧，也就是肉眼看到的卡顿。 二、场景模拟 1\. 准备工作 通过一个小方块平移运动模拟浏览器渲染图形 使用while模拟js阻塞 2\. 测试正常运行js耗费时间 可以看到总耗时2s，页面在js运行期间卡住了，小方块完全没有响应，直到...

三年前端还不会配置Nginx？刷完这篇就够了

一口气看完，比自学强十倍！ 什么是Nginx Nginx是一个开源的高性能HTTP和反向代理服务器。它可以用于处理静态资源、负载均衡、反向代理和缓存等任务。Nginx被广泛用于构建高可用性、高性能的Web应用程序和网站。它具有低内存消耗、高并发能力和良好的稳定性，因此在互联网领域非常受欢迎。 为什么使用Nginx 1. 高性能：Nginx采用事件驱动的异步架构，能够处理大量并发连接而不会消耗过多的系统资源。它的处理能力比传统的Web服务...

功能问题：如何限制同一账号只能在一处登录

大家好，我是大澈！ 本文约 字，整篇阅读大约需要 分钟。 感谢关注微信公众号：“程序员大澈”，免费领取" "一份，然后免费加入 ，从此让解决问题的你不再孤单！ 1\. 需求分析 前阵子，和问答群里一个前端朋友，随便唠了唠。期间他问了我一个问题，让我印象深刻。 他问的是，限制同一账号只能在一处设备上登录，是如何实现的？并且，他还把这个功能称为“单点登录”。 我说这不叫“ ”，这是“ ”。 于是，当时对此概念区分不清的他，和我在语言上开始了...

性能优化例子：使用Performance工具分析性能瓶颈，解决页面卡顿

对于前端的性能优化，优化手段其实是非常多的，但是不能盲目的进行优化，一定要先分析出项目的性能瓶颈，否则只会做无用功。那么如何才能更好的分析出项目的瓶颈呢？其实最关键的就是要分析页面的整个加载过程，找出有问题的地方再进行优化。使用谷歌浏览器自带的 Performance 工具可以帮我们解决这个问题，下面通过一个例子来进行分析优化！ 在优化之前，我们先要了解一些知识，比如浏览器的渲染帧、Performance 工具的使用，这样才有助于更好地...

css - 如何解决滚动条scrollbar出现造成的页面宽度被挤压的问题

引言 页面滚动条造成宽度减小的场景很常见了，由于 块级元素的流动性，其宽度默认为100%的 宽度，但是当容器的高度超过视口宽度时候，页面就会出现滚动条，这个滚动条的宽度就会挤压 的可用宽度，也就是会挤压我们的容器的宽度，造成页面晃动的现象，很不友好，下面就来探讨下如何解决这个滚动条的问题。 滚动条的宽度是多少？ 既然要解决滚动条造成的问题那么首先需要了解滚动条，即 的信息主要就是他的宽度，我们把页面的 置为 ，那么滚动条就会默认占据了空...