XboxYan

通常情况下，我们要实现代码高亮功能，需要借助复杂的语法高亮库，例如Prism或highlight.js 这些库的基本原理是扫描代码，并将关键词包裹一层标签，然后通过CSS样...

起因 在网上冲浪时看到了一个非常炫酷得效果，自我学习掌握后又开发出来得长虹玻璃效果，第一时间分享给大家！ 什么是长虹玻璃效果(Fluted) 简单得说就是类似透过磨砂玻璃看...

介绍一个你可能见过的文本两端布局（也可以叫文本均等分布），如下 说难不难，说简单也不简单。这里盘点了多种实现该布局的方式，看看你都知道哪些吧~ 一、加空格 很多人从直觉上会...

本文，我们来看这么个有意思的问题。使用 CSS，实现在页面屏幕中有一长串多行字母，现在需要随着页面滚动，改变每个字母的颜色。这也是掘金上一个同学的私信提问： 这里和这位同学...

我们经常会在博客、文档中看到类似这样的侧边导航目录，例如 这种导航也被称为“电梯导航”（当然可能还有其他叫法，知道是这个交互就行）。它会随着内容的滚动而自动切换当前选中态，...

很多 CSS 特性更新是非常隐晦的，导致很容易被忽视。最近，Chrome 123 就新增了paint-order对普通文本的支持，这就让文字描边实现更加容易了。 这并不是一...

大家好，我是前端西瓜哥。 有人问我要怎么解析在 Figma 编辑器中复制的图形数据。 我以前其实有想过解析复制的数据，只是没太大动机，后面也忘了。既然有人问，那我就顺手解析...

大家好，我是前端西瓜哥。 本文将介绍图形编辑器中吸附系统中，各种吸附类型的吸附逻辑和算法实现，让大家对吸附有一个概念。 吸附类型常见的有这么几种： 网格吸附； 极轴追踪； ...

几乎每个前端开发都应该用过这个滑动组件库吧？这就是大名鼎鼎的swiper.js 当然我也不例外，确实非常全面，也非常强大。 不过很多时候，我们可能只用到了它的10%不到的功...

大家好，我是前端西瓜哥。 我在 2023 年年初开源了自己的开源项目 Suika。 这是一款 Web 端图形编辑器，可以让用户自由地创建编辑各种图形。 目前界面又进化了一点...

本文将从客户端角度，聊聊如何借助端能力优化前端首屏加载速度。除了方案介绍，本文还会提供数据收益、注意事项、开发成本等，以帮助大家更好的评估实现优先级，选择合适业务的方案。...