FontCut ✂ 字体裁剪Chrome插件

基于opentype.js 实现了一个字体裁剪Chrome插件,能够预览字体并导出otf和woff格式的字体子集。目前font-carrier,fontkit,fontmin等等字体裁剪方案只能借助服务端能力,着实不便。其实这些项目大多也是基于opentype.js的。opentype.js 能够解析 ttf otf woff 三种文件格式解析为一个 font 类,本身提供了在浏览器运行的能力。字体科普ttf 与 otfOpenType字体的Outline描述方法主要有TrueType和P...

一种使用倒排索引和位图的快速SKU选择方法

使用所有有货的SKU组合生成该SKU到该组合的索引。如 [A-B,B-C] 即生成 {A:[1],B:[1,2],C:[2]}。映射到视图时只需要判断当前选中项的SKU索引的交集(默认为全集),例如选中B,则[1,2,3]与[1,2]的交集[1,2],然后依次遍历SKU,判断SKU对应的索引与当前选中索引是否有交集。如果有则可选,没有则置灰。索引可以使用位图数据结构,在判断是否为交集使用位运算提升性能。 const sku = []; const revertIndex = {...

Preact isomophic style 实现 CSS 同构

实现SSR不仅需要输出HTML字符串,还要包括关键渲染路径的CSS插入到HTML中,如果样式需要浏览器加载完 CSS 后才会加上,这个样式添加的过程就会造成页面的闪动,SSR也就没有意义了。在服务端我们不能使用style-loader,因为它只能在浏览器环境将CSS插入到页面中,我们采用isomophic style load在服务器端输出 html 字符串的同时,也将页面用到的样式抠出来,然后插入到 html 字符串当中,将结果一同传送到客户端。下面是webpack中用到了loader部...