Grewer

摘要： 引言 前一段时间, 正好在做微前端的接入和微前端管理平台的相关事项。 而我们当前使用的微前端框架则是 qiankun, 他是这样介绍自己的: qiankun 是一个基于 single-spa 的微前端实现库，旨在帮助大家能更简单、无痛的构建一个生产可用微前端架构系统。 所以本文基于 single-s 阅读全文

摘要： 前言 上一文讲到了图片, 这里我们就讲一个常用的图片场景: 瀑布流, 他的实现和优化 什么瀑布流 瀑布流，又称瀑布流式布局。是比较流行的一种网站页面布局，视觉表现为参差不齐的多栏布局，随着页面滚动条向下滚动，这种布局还会不断加载数据块并附加至当前尾部。最早采用此布局的网站是 Pinterest，逐渐 阅读全文

摘要： 术语表 首先我们需要知道一些术语, 才能更好地理解, 如果您已经了解, 可以跳过这一段 锚点 (anchor) 锚指的是一个选区的起始点（不同于 HTML 中的锚点链接）。当我们使用鼠标框选一个区域的时候，锚点就是我们鼠标按下瞬间的那个点。在用户拖动鼠标时，锚点是不会变的。 焦点 (focus) 选 阅读全文

摘要： 前言 在当前的 web 开发过程中, 图片的使用是一种重要的功能 本期就来聊聊, 开发中的图片以及我们如何优化图片 图片的类型以及对比 位图 位图的特点是可以表现色彩的变化和颜色的细微过渡，产生逼真的效果，缺点是在保存时需要记录每一个像素的位置和颜色值，占用较大的存储空间。 位图的文件类型很多，如* 阅读全文

摘要： 前言 在富文本编辑器场景中, 表格是一种不可忽视的功能, 但是在当前 quill.js 的正式版本(1.x)中, 却不支持此功能 所以本文承接上文 链接, 来讲述下 quill.js 升级到 2.x 的问题以及添加表格功能 为什么需要升级 在目前的 1.x 版本中并不支持表格的元素, 而我们想要这个 阅读全文

摘要： 前言 在前端开发中, 富文本是一种常见的业务场景, 而本文要讲的就是富文本框架 quill.js 中的自定义工具栏的开发 介绍 Quill.js 是一个具有跨平台和跨浏览器支持的富文本编辑器。凭借其可扩展架构和富有表现力的 API，可以完全自定义它以满足个性化的需求。由于其模块化架构和富有表现力的 阅读全文

摘要： 前言 本文主要介绍 react-native(下称 RN) 的入门, 和前端的异同点 文章不涉及功能的具体实现 选择优势 我们先说说, 为什么很多人会选择使用 RN 、他对应的特性和普通 Web 的区别 前端资源, 生态的互通 因为使用的语言是 JS 和 react, 对于前端来说可以无缝切换, 并 阅读全文

摘要： 介绍 Bun 是一个现代的JavaScript运行环境，如Node, Deno。主要特性如下: 启动速度快。 更高的性能。 完整的工具（打包器、转码器、包管理）。 下面我们来横向对比下框架所说的性能: 相同电脑下, 不同 js 运行环境的每秒操作数 更多具体的优点 内置 fetch、WebSocke 阅读全文

摘要： 起因 场景一: 当前项目经历了刀耕火种地开发, 之后接入了 cli 工具集中管理打包, 那么项目中的依赖, 和 cli 工具中的依赖重合度是多少, 并且他的的版本是否相同, 是否有冗余代码 场景二: 项目中某一个库升级了, 他依赖了 A 库的 V3 版本, 同时当前项目依赖的是 A 库 V2版本, 阅读全文

摘要： 前言 在现代浏览器中, 我们会经常看到这样的属性: element { --main-bg-color: brown; } 这里我们就来介绍一下他, 并提供一些相关的说明 简介 自定义属性（有时候也被称作CSS变量或者级联变量）是由CSS作者定义的，它包含的值可以在整个文档中重复使用。由自定义属性标 阅读全文

摘要： 背景 在当前业务项目中使用的 react-router 版本为 3.x, 而当前主流使用的是 5.x 以上, 本文就来探究 react-router 升级的方案 当前情况 目前使用的是 react-router3.x 版本 再加上和 redux 的搭配库 react-router-redux 一起使 阅读全文

摘要： 前言 在前一段时间做一个需求的时候, 碰到一个自定义列表的功能, 他的所有数据显示都是通过 jSON 字符串来存储,使用也是通过 JSON 解析 起先他是有数据上限的, 但是后面提高上限后就出现了卡顿等问题, 所以本文就是介绍一些方案来解决前端大量数据的渲染问题 方案 innerHTML 首先是在很 阅读全文

摘要： react-window 这篇是 react-window 的源码阅读, 因为此库使用的是 flow, 所以会涉及一些特殊的东西, 和 ts 类似 使用 List 首先是 List 的使用: import {FixedSizeList as List} from 'react-window'; co 阅读全文

摘要： 前言: 这次本来想解析 react-virtualized 的源码, 但是他的内容太多, 太杂, 我们先从小的库入手, 由点及面 所以这次改为了 react-virtual 和 react-window 的源码, 这篇就是 react-virtual 什么是虚拟列表 一个虚拟列表是指当我们有成千上万 阅读全文

摘要： 这次的版本是 6.2.1 使用 相比较 5.x 版本, 元素升级为了 简单的 v6 例子: function App(){ return <BrowserRouter> <Routes> <Route path="/about" element={<About/>}/> <Route path="/ 阅读全文