做一个有温度和有干货的技术分享作者 —— Qborfy

背景

最近在做低代码平台项目中遇到一个很容易遇到的问题，具体描述如下：

• 问题描述：低代码平台依赖的组件库，如果将一个组件库进行融合打包到平台项目中的就会导致平台在渲染页面的时候需要加载完整的组件库，从而导致页面加载了一些大部分页面不需要的组件文件
• 希望方案：页面使用到哪些组件就去动态加载组件
• 解决方案：
  • Vue的异步加载组件，Suspense和defineAsyncComponent
  • React的异步加载组件， Suspense和import()

由于低代码项目本身使用的 Vue3 框架，而且 Vue和 React的异步加载组件方案其实差异不多，所以下面以 Vue为主进行介绍。

参考资料

• k8s学习资料 https://kuboard.cn/learning/
• k8s管理界面 https://github.com/eip-work/kuboard-press

做一个有温度和有干货的技术分享作者 —— Qborfy

思考的框架

我们绝大部分行为都是建立在我们所理解的知识领域基础之上，所以我们大部分决策都是都是存在盲区，为了做出更好的决策，本书讲述了不同的思维模型，用来让你的大脑在做出决策之前可以通过不同的思维角度去思考。

做一个有温度和有干货的技术分享作者 —— Qborfy

做一个有温度和有干货的技术分享作者 —— Qborfy

前言

循环轮播图，基本上大家用的都是现有组件，如果要让你自己设计实现一个，其实最主要的两个点：循环算法和滚动动画

手写难度：⭐️⭐️

涉及知识点：

• 循环播放的思路
• CSS 动画，transtion和 transform
• Web Component 自定义组件

做一个有温度和有干货的技术分享作者 —— Qborfy

背景

最近在开发一个简单的个人记录网站，技术栈是使用 Vite + Vue3，由于使用的单台服务器，有时候服务器会被限制带宽，所以平时都会比较访问比较慢。所以想实现一个离线应用，而 PWA 应用则是目前最佳方案。

本文涉及知识点如下：

• PWA 的概念
• Service Worker使用
• 用构建工具搭建 PWA 应用

背景

其实从今年开始运营这个博客，我一直想增加一些新的交互功能，如：评论，之前一直有些问题没搞定，现在终于通过 Google 搜索解决问题了， 其实也算是每天学习一些新东西。

解决问题：给 Hexo 博客新增 Github评论功能

为什么选择 Github 呢？是因为 Github 对于偏向开发人员基本上属于一个必注册网站，而我博客的内容又偏向于技术，所以才会采取这个。

前言

虚拟滚动在前端中是一个很常见的解决方案，由于浏览器对于内存的限制，当页面需要展示大量 DOM 节点（如：列表数据超过 10 万）的时候，如果完整渲染整个 DOM 树，当页面数据需要更新重新渲染的时候就会出现滚动卡顿，这个时候就需要虚拟滚动去模拟浏览器原生滚动事件，从而避免这个卡顿情况。

手写难度：⭐️⭐️⭐️

涉及知识点：

• 滚动监听事件 wheel/move
• 事件节流
• 滚动偏移量 offset
• 按需渲染计算方案

前言

前端路由，大家都使用过，那么有没有想过它是怎么实现的吗？如：Vue-Router 或者 React-Router。或许有个大概印象，但是真正要自己去实现还是没有什么思路，那么这篇文章将完整的实现思路去实现一次。

手写难度：⭐️⭐️⭐️

涉及知识点：

• history api 和监听事件
• onhashchange 监听事件
• Web Component 自定义组件

背景

之前有写过专门一篇关于微前端架构的基础知识——《前端架构成长之路——微前端架构理论篇》，但是里面主要讲几个点：

• 微前端是什么，具体能做些什么
• 微前端的一些主流框架
• 微前端拆分项目的一些原则

那么其实对于微前端应用还是有些不太清楚，下面就用微前端架构去对某个古老项目进行框架升级，这其实也是微前端架构主要特性之一，对项目升级的方案之一。