FYAN2001的博客

代码高亮的可行性方案，highlight.js

FYAN2001 — Mon, 23 May 2022 14:15:30 +0800

在博客或者文档中，通常会需要会需要高亮显示代码，这通常需要满足屏幕大，高刷(...bushi), 应该是配色好看，插件生态丰富。目前实现代码分割的主要是两个库PrismJS,highlight.js

vue 中使用 highlight.js , 及代码高亮组件

FYAN2001 — Wed, 18 May 2022 14:37:17 +0800

一个组件一个prop实现代码高亮在编写组件文档或者博客时，经常有需要贴代码的地方，同时为了美观，我们通常想要其像vscode那样高亮显示代码。如果你是用 vuepress 等 vue-powered 生成的静态SSR 博客或者文档项目，你将没有这部分的顾虑，markdown语法的编译会帮您做好一切的事情但如果你只是想给组件写一个说明文档，或者一个简单的github-page 你可能会用到代码高亮组件提供了明暗两种风格复制选项滚动条样式优化等等开箱即用，大小仅有2

IntersectionObserver 使用，懒加载列表实现，虚拟列表探索

FYAN2001 — Wed, 11 May 2022 14:15:04 +0800

使用IntersectionObserver 可以让我们快速实现懒加载和虚拟列表首先我们创建 observer 观察者实例 observer = new IntersectionObserver(callback, options); options 是配置的参数 (选填) observer 则是一个观察器实例有一些基础的方法 // 开始观察 observer.observe(document.getElementById('example')); // 停止观察 observer.un

面试手写JS必会

FYAN2001 — Fri, 08 Oct 2021 14:02:28 +0800

Git git 更多完整手写JS，之后也会以文章的形式稍后更新防抖，节流防抖为事件触发后N秒后执行回调，如果在N秒内再次触发，则重新计数，类似于百度的搜索效果 debounce // func是用户传入需要防抖的函数 // wait是等待时间 const debounce = (func, wait = 50) => { // 缓存一个定时器id let timer = 0 // 这里返回的函数是每次用户实际调用的防抖函数 // 如果已经设定过定时器了就清空上一次的定时器

Vue中的ref的作用与使用(附带源码)

FYAN2001 — Thu, 15 Jul 2021 12:51:52 +0800