@wcj/github-rank 21.11.16 → 21.11.17

package/dist/sifou-daily.json

@@ -1,146 +1,200 @@
 [
   {
-    "title": "程序员开源新项目“碾压”价值 7.5 亿的官方版，皆因孩子的 “IT 灾难”校务系统太垃圾",
-    "description": "无处不在的开源，为科技领域带来巨大变革和创新的同时，安全问题也成为全球关注的焦点。最近，来自瑞典斯德哥尔摩市的程序员 Landgren ，就因为看不惯自家孩子学校的 IT 系统（Skolplattform），拉上其他家长一起...",
-    "url": "https://segmentfault.com/a/1190000040960011",
-    "author": "MissD",
-    "home_url": "https://segmentfault.com/u/d2ms1shh",
-    "votes": "3",
+    "title": "重写数组的方法（改变原数组）",
+    "description": "下图是我自我学习模拟数组时总结的一些重新数组的方法：本文我们暂不讨论不改变原数组的方法，只谈改变原数组用到的 6 种方法。改变原数组的方法push()按参数顺序向数组尾部添加元素，返回新数组的长度 {代码...}...",
+    "url": "https://segmentfault.com/a/1190000040969572",
+    "author": "云叔_又拍云",
+    "home_url": "https://segmentfault.com/u/yunshu_blog",
+    "votes": "6",
     "rank": 1
   },
   {
-    "title": "Flutter 页面滚动吸顶详解（NestedScrollView）",
-    "description": "在业务开发中我们经常会有滚动吸顶的效果，目前Flutter也有很多种实现方式，这里介绍一下本人在开发中使用到的基于NestedScrollView实现的滚动吸顶组件；以及中间涉及的各种定位的布局操作；",
-    "url": "https://segmentfault.com/a/1190000040961263",
-    "author": "浅夏晴空",
-    "home_url": "https://segmentfault.com/u/qianxiaqingkong",
-    "votes": "2",
+    "title": "巧用滤镜实现高级感拉满的文字快闪切换效果",
+    "description": "当然，今天并非是想用 CSS 实现上述的的效果。在尝试的过程中，我发现了另外一类能够使用 CSS 非常轻松实现文字快闪动画，运用了blur() 滤镜和 contrast() 滤镜产生的融合效果，类似于这样：",
+    "url": "https://segmentfault.com/a/1190000040965698",
+    "author": "chokcoco",
+    "home_url": "https://segmentfault.com/u/chokcoco",
+    "votes": "5",
     "rank": 2
   },
   {
-    "title": "第八期:前端九条启发分享",
-    "description": "在一般情况下, 我们每次执行git commit -m'提交信息'的时候, 会触发针对commit信息的校验以及代码风格的校验, 如果没通过校验会导致commit失败, 那么这些校验是如何加入到项目中的那?",
-    "url": "https://segmentfault.com/a/1190000040962801",
-    "author": "lulu_up",
-    "home_url": "https://segmentfault.com/u/lulu_up",
-    "votes": "3",
+    "title": "你不知道的 Node.js Util",
+    "description": "从类型判断说起在 JavaScript 中，进行变量的类型校验是一个非常令人头疼的事，如果只是简单的使用 typeof 会到各种各样的问题。举几个简单的🌰： {代码...} 后来，大家发现可以使用 Object.prototype.toString() ...",
+    "url": "https://segmentfault.com/a/1190000040966152",
+    "author": "Shenfq",
+    "home_url": "https://segmentfault.com/u/shenfq",
+    "votes": "2",
     "rank": 3
   },
   {
-    "title": "Puppeteer 入门指引",
-    "description": "Puppeteer 是一个 Node library，提供了一套完整的通过 DevTools 协议操纵 Chrome 或 Chromium 的 API。Puppeteer 默认以 无头（headless） 的方式运行, 也可以使用 GUI 的方式运行 Chrome 和 Chromium。",
-    "url": "https://segmentfault.com/a/1190000040961411",
-    "author": "MudOnTire",
-    "home_url": "https://segmentfault.com/u/mudontire",
-    "votes": "3",
+    "title": "TypeScript 之 More on Functions",
+    "description": "函数是任何应用的基础组成部分，无论它是局部函数（local functions），还是从其他模块导入的函数，亦或是类中的方法。当然，函数也是值 (values)，而且像其他值一样，TypeScript 有很多种方式用来描述，函数可以...",
+    "url": "https://segmentfault.com/a/1190000040970467",
+    "author": "冴羽",
+    "home_url": "https://segmentfault.com/u/yayu",
+    "votes": "2",
     "rank": 4
   },
   {
-    "title": "CodeGuide 300+文档、100+代码库，一个指导程序员写代码的，Github 仓库开源啦！",
-    "description": "作者：小傅哥<br/>博客：[链接]沉淀、分享、成长，让自己和他人都能有所收获！😄一、路怎样走，让你们自己挑B站 视频：[[链接])五年前，香河大厂村，开张大吉。我和弟兄们雄心壮志，坐公交车去面试，谁知道...",
-    "url": "https://segmentfault.com/a/1190000040959107",
-    "author": "小傅哥",
-    "home_url": "https://segmentfault.com/u/fuzhengwei",
-    "votes": "3",
+    "title": "面试题整理之Vue篇",
+    "description": "又快到年底了，有很多小伙伴可能会选择跳槽或者升职或者考核，尤其重要的是面试，在面试过程中面试官总会问一些基础性的内容来考察我们的专业知识的掌握程度，再决定是否录用。",
+    "url": "https://segmentfault.com/a/1190000040971075",
+    "author": "Aaron",
+    "home_url": "https://segmentfault.com/u/aaronblog",
+    "votes": "4",
     "rank": 5
   },
   {
-    "title": "LeetCode-107-二叉树的层序遍历 II",
-    "description": "题目描述：给定一个二叉树，返回其节点值自底向上的层序遍历。 （即按从叶子节点所在层到根节点所在的层，逐层从左向右遍历）示例说明请见LeetCode官网。来源：力扣（LeetCode） 链接：[链接] 著作权归领扣网络所...",
-    "url": "https://segmentfault.com/a/1190000040959999",
-    "author": "雄狮虎豹",
-    "home_url": "https://segmentfault.com/u/xiongshihubao",
-    "votes": "2",
+    "title": "JuiceFS 在大搜车数据平台的实践",
+    "description": "大搜车已经搭建起比较完整的汽车产业互联网协同生态。在这一生态中，不仅涵盖了大搜车已经数字化的全国 90% 中大型二手车商、9000+ 家 4S 店和 70000+ 家新车二网，还包括大搜车旗下车易拍、车行168、运车管家、...",
+    "url": "https://segmentfault.com/a/1190000040968418",
+    "author": "JuiceFS",
+    "home_url": "https://segmentfault.com/u/juicefs",
+    "votes": "3",
     "rank": 6
   },
   {
-    "title": "处理可能超时的异步操作",
-    "description": "自从 ECMAScript 的 Promise ES2015 和 async/await ES2017 特性发布以后，异步在前端界已经成为特别常见的操作。异步代码和同步代码在处理问题顺序上会存在一些差别，编写异步代码需要拥有跟编写同步代码不同的“...",
-    "url": "https://segmentfault.com/a/1190000040963849",
-    "author": "边城",
-    "home_url": "https://segmentfault.com/u/jamesfancy",
-    "votes": "1",
+    "title": "Vue项目优化打包——前端加分项",
+    "description": "前言Vue项目开发完毕后，对项目进行打包发布之前，必不可少的操作就是项目优化，这也是程序猿的加分项。跟随本文的脚步来看看如何对项目进行优化吧~",
+    "url": "https://segmentfault.com/a/1190000040967014",
+    "author": "CRMEB",
+    "home_url": "https://segmentfault.com/u/crmeb",
+    "votes": "3",
     "rank": 7
   },
   {
-    "title": "【JavaScript定时器小案例】常见的几种定时器实现的案例",
-    "description": "【JavaScript定时器小案例】常见的几种定时器实现的案例博客说明文章所涉及的资料来自互联网整理和个人总结，意在于个人学习和经验汇总，如有什么地方侵权，请联系本人删除，谢谢！说明在日常开发中定时器的使用...",
-    "url": "https://segmentfault.com/a/1190000040963664",
-    "author": "归子莫",
-    "home_url": "https://segmentfault.com/u/guizimo",
-    "votes": "1",
+    "title": "使用 @Transactional 时常犯的N种错误",
+    "description": "@Transactional是我们在用Spring时候几乎逃不掉的一个注解，该注解主要用来声明事务。它的实现原理是通过Spring AOP在注解修饰方法的前后织入事务管理的实现语句，所以开发者只需要通过一个注解就能代替一系列繁...",
+    "url": "https://segmentfault.com/a/1190000040967878",
+    "author": "程序猿DD",
+    "home_url": "https://segmentfault.com/u/coderdd",
+    "votes": "2",
     "rank": 8
   },
   {
-    "title": "Webstorm 插件开发",
-    "description": "PSI(Program Structure Interface) 文件是表示一个文件的内容作为在一个特定的编程语言元素的层次结构的结构的根。",
-    "url": "https://segmentfault.com/a/1190000040959562",
-    "author": "MangoGoing",
-    "home_url": "https://segmentfault.com/u/nulidexiaocongmang",
+    "title": "LeetCode-108-将有序数组转换为二叉搜索树",
+    "description": "题目描述：给你一个整数数组 nums ，其中元素已经按 升序 排列，请你将其转换为一棵 高度平衡 二叉搜索树。高度平衡 二叉树是一棵满足「每个节点的左右两个子树的高度差的绝对值不超过 1 」的二叉树。示例说明请...",
+    "url": "https://segmentfault.com/a/1190000040965498",
+    "author": "雄狮虎豹",
+    "home_url": "https://segmentfault.com/u/xiongshihubao",
     "votes": "2",
     "rank": 9
   },
   {
-    "title": "CODING Compass —— 打造行云流水般的软件工厂",
-    "description": "本文根据 CODING Compass 产品总监程胜聪在腾讯云 CIF 工程效能峰会上所做的分享，进行了整理与更新。文末可前往峰会官网，观看回放并下载 PPT。",
-    "url": "https://segmentfault.com/a/1190000040963121",
-    "author": "CODING",
-    "home_url": "https://segmentfault.com/u/codingnet",
+    "title": "源码泄露“危机“？阿里云、字节等大厂服务器疑似被海外黑客组织入侵，源代码被出售",
+    "description": "11 月 11日，海外黑客组织 “AgainstTheWest” （简称ATW）在 raidforums 论坛放猛料，宣称他们窃取了中国服务器的源码，并疯狂将其泄露出来打包售卖。据悉，其攻击目标疑似已涉及到国内阿里、腾讯及字节等科技“大...",
+    "url": "https://segmentfault.com/a/1190000040966993",
+    "author": "MissD",
+    "home_url": "https://segmentfault.com/u/d2ms1shh",
     "votes": "1",
     "rank": 10
   },
   {
-    "title": "Fabric.js - 轻而易举操作canvas的神奇库",
-    "description": "本文来自于Fabricjs中文版，这个站点是我经过社区允许后部署的一份国内版，希望招募同样对fabricjs感兴趣的人一起来翻译建设，在每篇文章下面都有提PR的链接，只要使用github在写编辑即可",
-    "url": "https://segmentfault.com/a/1190000040959897",
-    "author": "阿古达木",
-    "home_url": "https://segmentfault.com/u/chenxiang_594a1cea112c2",
+    "title": "线程如何实现保持同步",
+    "description": "线程同步的方式主要有: 临界区（Critical Section）、互斥量（Mutex）、信号量（Semaphore）、事件（Event）。",
+    "url": "https://segmentfault.com/a/1190000040966841",
+    "author": "江湖大侠",
+    "home_url": "https://segmentfault.com/u/msjhw_com",
     "votes": "1",
     "rank": 11
   },
   {
-    "title": "MySQL打印死锁日志",
-    "description": "在 MySQL 运维过程中，难免会遇到 MySQL 死锁的情况，一旦线上业务日渐复杂，各种业务操作之间往往会产生锁冲突，有些会导致死锁异常。这种死锁异常一般要在特定时间特定数据和特定业务操作才会复现，有时候处理...",
-    "url": "https://segmentfault.com/a/1190000040959047",
-    "author": "MySQL技术",
-    "home_url": "https://segmentfault.com/u/mysqljs",
+    "title": "React 18 Beta来了",
+    "description": "大家好，我卡颂。经过React18工作组几个月工作，11月16日v18终于从Alpha版本更新到Beta版本。本文会解释：这次更新带来的变化对开发者的影响如何安装v18 Betav18稳定版何时会来带来的变化经过与社区不断沟通，Bet...",
+    "url": "https://segmentfault.com/a/1190000040966821",
+    "author": "卡颂",
+    "home_url": "https://segmentfault.com/u/kasong",
     "votes": "1",
     "rank": 12
   },
   {
-    "title": "分布式事务框架dtm1.5.4发布，支持更友好的gRPC类型",
-    "description": "更新日志更加友好的gRPC类型支持，输入输出支持任何类型添加例子启动时等待mysql，避免因mysql启动慢而退出新功能示例旧的proto文件示例： {代码...} 使用时需要进行转化 {代码...} 新的proto文件示例 {代码...} ...",
-    "url": "https://segmentfault.com/a/1190000040958801",
-    "author": "叶东富",
-    "home_url": "https://segmentfault.com/u/yedongfu",
-    "votes": "3",
+    "title": "前端服务框架调研：Next.js、Nuxt.js、Nest.js、Fastify",
+    "description": "这次 Node.js 服务框架的调研将着点于各框架功能、请求流程的组织和介入方式，以对前端 Node.js 服务设计和对智联 Ada 架构改进提供参考，不过多关注具体实现。",
+    "url": "https://segmentfault.com/a/1190000040966032",
+    "author": "智联大前端",
+    "home_url": "https://segmentfault.com/u/zpfe",
+    "votes": "1",
     "rank": 13
   },
   {
-    "title": "oeasy教您玩转vim - 62 - # 缓冲buffer",
-    "description": "编辑过程回忆上次我们这次了解了编辑过程默认有一个替换文件swap修改的内容会保存到一个swap文件如果swp已经存在会有个swo文件以此类推替换文件可以进行对源文件的修复没保存到源文件的可能保存到了替换文件可以...",
-    "url": "https://segmentfault.com/a/1190000040958622",
-    "author": "oeasy",
-    "home_url": "https://segmentfault.com/u/oeasy",
-    "votes": "1",
+    "title": "Kafka知识点总结",
+    "description": "Kafka是一个 Scala 语言开发的多分区、多副本、分布式的基于发布/订阅模式的消息队列。目前 Kafka 已经定位为一个分布式流式处理平台，它以高吞吐、可持久化、可水平扩展、支持流数据处理等多种特性而被广泛使用。",
+    "url": "https://segmentfault.com/a/1190000040969234",
+    "author": "西柚",
+    "home_url": "https://segmentfault.com/u/shannonwang",
+    "votes": "3",
     "rank": 14
   },
   {
-    "title": "关闭浏览器或者刷新浏览器弹窗提示，可以取消或者确认。",
-    "description": "添加如下js代码即可 {代码...} vue中使用 {代码...}",
-    "url": "https://segmentfault.com/a/1190000040958314",
-    "author": "张旭超",
-    "home_url": "https://segmentfault.com/u/kobe_fans_zxc",
+    "title": "不使用任何框架，手写纯 JavaScript 实现上传本地文件到 ABAP 服务器",
+    "description": "采用 SAP UI5 sap.ui.unified.FileUploader 控件，结合 Gateway 框架，实现本地文件上传到 ABAP 服务器，不是一件困难的事情。",
+    "url": "https://segmentfault.com/a/1190000040969053",
+    "author": "JerryWang_汪子熙",
+    "home_url": "https://segmentfault.com/u/jerrywangsap",
     "votes": "1",
     "rank": 15
   },
   {
-    "title": "JavaScript 数学曲线—双角线",
-    "description": "引子继星形线，接着尝试双角线（Bicorn）。OriginMy GitHub简介双角线也称为三角帽（cocked-ha）曲线，是 Sylvester 在 1864 年研究的一组四次曲线的名称。Cayley 在 1867 年研究了同样的曲线。在笛卡尔坐标系中...",
-    "url": "https://segmentfault.com/a/1190000040958391",
-    "author": "XXHolic",
-    "home_url": "https://segmentfault.com/u/xxholic",
+    "title": "暂缓MongoDB 4.4.2 、4.4.3、 4.4.4版本升级： 存在严重Bug",
+    "description": "据 MongoDB 官网发布：从 4.4.2～4.4.4 版本升级到 4.4.8+ 或 5.0.2 +版本时，存在严重 bug ，有升级计划的伙伴们请暂缓实施。",
+    "url": "https://segmentfault.com/a/1190000040966332",
+    "author": "六一",
+    "home_url": "https://segmentfault.com/u/suicidal_romantic_scoundrel",
     "votes": "1",
     "rank": 16
+  },
+  {
+    "title": "当 Swagger 遇上 Torna，瞬间高大上了！",
+    "description": "Swagger作为一款非常流行的API文档生成工具，相信很多小伙们都在用！用多了可能会觉得它界面丑、功能弱。今天给大家推荐一款工具Torna，配合Swagger使用可以搭建界面漂亮、功能强大的API文档网站，希望对大家有所...",
+    "url": "https://segmentfault.com/a/1190000040965512",
+    "author": "macrozheng",
+    "home_url": "https://segmentfault.com/u/macrozheng",
+    "votes": "1",
+    "rank": 17
+  },
+  {
+    "title": "抽象利器 - 泛型",
+    "description": "泛型的基本概念简单介绍一下 Java 的泛型机制，以及使用泛型的好处？Java 的泛型是 JDK 5 之后引入的一个新特性，主要的作用就是：提供编译时类型安全监测的机制。泛型的本质是参数化类型，就是说被操作的数据类...",
+    "url": "https://segmentfault.com/a/1190000040965315",
+    "author": "啊哈",
+    "home_url": "https://segmentfault.com/u/aha_6193074832a65",
+    "votes": "1",
+    "rank": 18
+  },
+  {
+    "title": "在后端中如何实现幂等和去重？",
+    "description": "面试官：要不你来讲讲你最近在看的点呗？可以拉出来一起讨论下候选者：最近在看「去重」和「幂等」相关的内容面试官：那你就先来聊聊你对「去重」和「幂等」的理解吧候选者：我认为「幂等」和「去重」它们很像，...",
+    "url": "https://segmentfault.com/a/1190000040965045",
+    "author": "Java3y",
+    "home_url": "https://segmentfault.com/u/java_3y",
+    "votes": "1",
+    "rank": 19
+  },
+  {
+    "title": "Ubuntu20.04配置PCL库",
+    "description": "目前研究的方向是基于车载激光雷达进行道路环境的三维高精地图的构建。这种高精地图是以车载激光雷达采集的点云为基准，以图像为辅助来进行道路环境信息的识别的提取。其中对点云的处理十分重要，针对点云进行工...",
+    "url": "https://segmentfault.com/a/1190000040969104",
+    "author": "德布劳钦",
+    "home_url": "https://segmentfault.com/u/debulaoqin",
+    "votes": "1",
+    "rank": 20
+  },
+  {
+    "title": "面试官：你给我说一下什么是时间轮吧？",
+    "description": "你好呀，我是歪歪。今天我带大家来卷一下时间轮吧，这个玩意其实还是挺实用的。常见于各种框架之中，偶现于面试环节，理解起来稍微有点难度，但是知道原理之后也就觉得：大多数人谈到时间轮的时候都会从 netty 开...",
+    "url": "https://segmentfault.com/a/1190000040967147",
+    "author": "why技术",
+    "home_url": "https://segmentfault.com/u/whyjishu",
+    "votes": "1",
+    "rank": 21
+  },
+  {
+    "title": "云端干货｜降本必备—弹性伸缩的基本原理",
+    "description": "弹性伸缩（Auto Scaling）是云商提供的、根据自身业务需求自动调整计算能力（即实例数量）的服务。使用该服务时，实例数量可根据工作负载自动进行伸缩，从而在业务需求增长时提供资源支持、在业务需求下降时降低...",
+    "url": "https://segmentfault.com/a/1190000040966756",
+    "author": "SpotMax云上说禅",
+    "home_url": "https://segmentfault.com/u/spotmax",
+    "votes": "3",
+    "rank": 22
   }
 ]

package/dist/sifou-monthly.json

@@ -5,7 +5,7 @@
     "url": "https://segmentfault.com/a/1190000040906316",
     "author": "Sunshine_Lin",
     "home_url": "https://segmentfault.com/u/user_ze46ouik",
-    "votes": "48",
+    "votes": "50",
     "rank": 1
   },
   {
@@ -14,7 +14,7 @@
     "url": "https://segmentfault.com/a/1190000040846926",
     "author": "前端胖头鱼",
     "home_url": "https://segmentfault.com/u/116263",
-    "votes": "37",
+    "votes": "40",
     "rank": 2
   },
   {
@@ -26,6 +26,15 @@
     "votes": "37",
     "rank": 3
   },
+  {
+    "title": "一些常用的 Git 进阶知识与技巧",
+    "description": "假设我们在同一电脑上拥有多个 Git 账号，例如公司内部使用的是 Gitlab，个人使用的是 Github 或者 Gitee。那就会遇到一种情况，上班时想给个人开源项目提交代码，但是 Git 绑定的是公司的账号。",
+    "url": "https://segmentfault.com/a/1190000040930212",
+    "author": "谭光志",
+    "home_url": "https://segmentfault.com/u/woai3c",
+    "votes": "29",
+    "rank": 4
+  },
   {
     "title": "大道至简，繁在人心：在浏览器控制台安装npm包是什么操作？",
     "description": "我们都知道，npm 是 JavaScript 世界的包管理工具,并且是 Node.js 平台的默认包管理工具。通过 npm 可以安装、共享、分发代码,管理项目依赖关系。虽然作为命令行工具的 npm 近年来逐渐式微，但是作为广泛使用的存...",
@@ -33,15 +42,6 @@
     "author": "独钓寒江雪",
     "home_url": "https://segmentfault.com/u/king_hcj",
     "votes": "33",
-    "rank": 4
-  },
-  {
-    "title": "一些常用的 Git 进阶知识与技巧",
-    "description": "假设我们在同一电脑上拥有多个 Git 账号，例如公司内部使用的是 Gitlab，个人使用的是 Github 或者 Gitee。那就会遇到一种情况，上班时想给个人开源项目提交代码，但是 Git 绑定的是公司的账号。",
-    "url": "https://segmentfault.com/a/1190000040930212",
-    "author": "谭光志",
-    "home_url": "https://segmentfault.com/u/woai3c",
-    "votes": "28",
     "rank": 5
   },
   {
@@ -50,9 +50,18 @@
     "url": "https://segmentfault.com/a/1190000040879546",
     "author": "杨成功",
     "home_url": "https://segmentfault.com/u/ruidoc",
-    "votes": "31",
+    "votes": "33",
     "rank": 6
   },
+  {
+    "title": "前端架构师神技，三招统一代码风格（一文讲透）",
+    "description": "本文从代码规范，代码检查，代码格式化，以及编辑器自动化实现的方向，介绍代码规范统一在我们团队的实践应用。大纲预览本文介绍的内容包括以下方面：认识代码规范制定和统一规范神技一：ESLint神技二：Prettier...",
+    "url": "https://segmentfault.com/a/1190000040948561",
+    "author": "杨成功",
+    "home_url": "https://segmentfault.com/u/ruidoc",
+    "votes": "28",
+    "rank": 7
+  },
   {
     "title": "前端如何防止用户修改水印？",
     "description": "这篇文章聊到的「前端水印防篡改」方法，本来是想作为一份专利提交给公司的，但我下笔之前去国内的专利检索网站上搜了下，发现一模一样的方案已经被申请了，是一位字节跳动的哥们在今年年初递交的。",
@@ -60,7 +69,16 @@
     "author": "劉凯里",
     "home_url": "https://segmentfault.com/u/kyrieliu",
     "votes": "24",
-    "rank": 7
+    "rank": 8
+  },
+  {
+    "title": "3D 穿梭效果？使用 CSS 轻松搞定",
+    "description": "背景周末在家习惯性登陆 Apex，准备玩几盘。在登陆加速器的过程中，发现加速器到期了。我一直用的腾讯网游加速器，然而点击充值按钮，提示最近客户端升级改造，暂不支持充值（这个操作把我震惊了~）。只能转头下...",
+    "url": "https://segmentfault.com/a/1190000040936266",
+    "author": "chokcoco",
+    "home_url": "https://segmentfault.com/u/chokcoco",
+    "votes": "32",
+    "rank": 9
   },
   {
     "title": "尤雨溪几年前开发的“玩具 vite”，才100多行代码，却十分有助于理解 vite 原理",
@@ -69,7 +87,7 @@
     "author": "若川",
     "home_url": "https://segmentfault.com/u/lxchuan12",
     "votes": "30",
-    "rank": 8
+    "rank": 10
   },
   {
     "title": "N 种仅仅使用 HTML/CSS 实现各类进度条的方式",
@@ -77,26 +95,17 @@
     "url": "https://segmentfault.com/a/1190000040908304",
     "author": "chokcoco",
     "home_url": "https://segmentfault.com/u/chokcoco",
-    "votes": "22",
-    "rank": 9
-  },
-  {
-    "title": "使用 CSS Scroll Snap 优化滚动，提升用户体验！",
-    "description": "有梦想，有干货，微信搜索 【大迁世界】 关注这个在凌晨还在刷碗的刷碗智。本文 GitHub [链接] 已收录，有一线大厂面试完整考点、资料以及我的系列文章。",
-    "url": "https://segmentfault.com/a/1190000040824694",
-    "author": "前端小智",
-    "home_url": "https://segmentfault.com/u/minnanitkong",
-    "votes": "27",
-    "rank": 10
+    "votes": "23",
+    "rank": 11
   },
   {
-    "title": "MySQL灵魂拷问：36题带你面试通关",
-    "description": "大家好，我是大彬~今天给大家分享MySQL常考的面试题，看看你们能答对多少。本期MySQL面试题的目录如下：事务的四大特性？事务隔离级别有哪些？索引什么是索引？索引的优缺点？索引的作用？什么情况下需要建索引？...",
-    "url": "https://segmentfault.com/a/1190000040823877",
-    "author": "程序员大彬",
-    "home_url": "https://segmentfault.com/u/5n7qfpo1",
-    "votes": "22",
-    "rank": 11
+    "title": "【建议收藏】面试官贼喜欢问的 32+ vue 修饰符，你掌握几种啦？",
+    "description": "vue简洁好用体现在很多个地方，比如其内置了32+修饰符，可以很方便我们阻止冒泡、阻止默认事件、鼠标事件处理、系统键盘事件等等，让我们可以快速搞定业务，简直不要太方便噢！！！",
+    "url": "https://segmentfault.com/a/1190000040914312",
+    "author": "前端胖头鱼",
+    "home_url": "https://segmentfault.com/u/116263",
+    "votes": "25",
+    "rank": 12
   },
   {
     "title": "前端如何实现token的无感刷新",
@@ -105,26 +114,8 @@
     "author": "xiangzhihong",
     "home_url": "https://segmentfault.com/u/xiangzhihong",
     "votes": "26",
-    "rank": 12
-  },
-  {
-    "title": "3D 穿梭效果？使用 CSS 轻松搞定",
-    "description": "背景周末在家习惯性登陆 Apex，准备玩几盘。在登陆加速器的过程中，发现加速器到期了。我一直用的腾讯网游加速器，然而点击充值按钮，提示最近客户端升级改造，暂不支持充值（这个操作把我震惊了~）。只能转头下...",
-    "url": "https://segmentfault.com/a/1190000040936266",
-    "author": "chokcoco",
-    "home_url": "https://segmentfault.com/u/chokcoco",
-    "votes": "27",
     "rank": 13
   },
-  {
-    "title": "【建议收藏】面试官贼喜欢问的 32+ vue 修饰符，你掌握几种啦？",
-    "description": "vue简洁好用体现在很多个地方，比如其内置了32+修饰符，可以很方便我们阻止冒泡、阻止默认事件、鼠标事件处理、系统键盘事件等等，让我们可以快速搞定业务，简直不要太方便噢！！！",
-    "url": "https://segmentfault.com/a/1190000040914312",
-    "author": "前端胖头鱼",
-    "home_url": "https://segmentfault.com/u/116263",
-    "votes": "24",
-    "rank": 14
-  },
   {
     "title": "7分钟学会写一个浏览器插件——突破某SDN未登录禁止复制的限制",
     "description": "严格意义上说，本篇文章要讨论的应该是 “Chrome 扩展(Extension)”而不是“Chrome 插件（Plugins）”，大家不妨先思考一个问题：“浏览器插件”和“浏览器扩展”之间有什么区别？如果您对此感到厌烦，不妨直接跳过此小节...",
@@ -132,7 +123,7 @@
     "author": "独钓寒江雪",
     "home_url": "https://segmentfault.com/u/king_hcj",
     "votes": "22",
-    "rank": 15
+    "rank": 14
   },
   {
     "title": "CSS 实现文本\"不定行数\"截断",
@@ -141,7 +132,7 @@
     "author": "XboxYan",
     "home_url": "https://segmentfault.com/u/xboxyan",
     "votes": "22",
-    "rank": 16
+    "rank": 15
   },
   {
     "title": "前端应该知道的：开放图谱协议（The Open Graph protocol）",
@@ -150,16 +141,7 @@
     "author": "独钓寒江雪",
     "home_url": "https://segmentfault.com/u/king_hcj",
     "votes": "24",
-    "rank": 17
-  },
-  {
-    "title": "前端架构师神技，三招统一代码风格（一文讲透）",
-    "description": "本文从代码规范，代码检查，代码格式化，以及编辑器自动化实现的方向，介绍代码规范统一在我们团队的实践应用。大纲预览本文介绍的内容包括以下方面：认识代码规范制定和统一规范神技一：ESLint神技二：Prettier...",
-    "url": "https://segmentfault.com/a/1190000040948561",
-    "author": "杨成功",
-    "home_url": "https://segmentfault.com/u/ruidoc",
-    "votes": "19",
-    "rank": 18
+    "rank": 16
   },
   {
     "title": "把程序做成系统服务",
@@ -168,7 +150,16 @@
     "author": "边城",
     "home_url": "https://segmentfault.com/u/jamesfancy",
     "votes": "13",
-    "rank": 19
+    "rank": 17
+  },
+  {
+    "title": "前端Node.js面试题",
+    "description": "Node.js 是一个开源与跨平台的 JavaScript 运行时环境。在浏览器外运行 V8 JavaScript 引擎（Google Chrome 的内核），利用事件驱动、非阻塞和异步输入输出模型等技术提高性能。我们可以理解为：Node.js 就是一个...",
+    "url": "https://segmentfault.com/a/1190000040937008",
+    "author": "xiangzhihong",
+    "home_url": "https://segmentfault.com/u/xiangzhihong",
+    "votes": "17",
+    "rank": 18
   },
   {
     "title": "10个可视化 CSS 工具， 快速生成 CSS 片段，渣男，又想抛弃我！！",
@@ -177,7 +168,7 @@
     "author": "前端小智",
     "home_url": "https://segmentfault.com/u/minnanitkong",
     "votes": "25",
-    "rank": 20
+    "rank": 19
   },
   {
     "title": "23 个非常有用的 NodeJs 库",
@@ -186,7 +177,7 @@
     "author": "前端小智",
     "home_url": "https://segmentfault.com/u/minnanitkong",
     "votes": "22",
-    "rank": 21
+    "rank": 20
   },
   {
     "title": "关于 v-model 你需要知道的这一切！",
@@ -195,7 +186,7 @@
     "author": "前端小智",
     "home_url": "https://segmentfault.com/u/minnanitkong",
     "votes": "20",
-    "rank": 22
+    "rank": 21
   },
   {
     "title": "这些 JavaScript函数让你的工作更加 So Easy!",
@@ -204,6 +195,15 @@
     "author": "前端小智",
     "home_url": "https://segmentfault.com/u/minnanitkong",
     "votes": "25",
+    "rank": 22
+  },
+  {
+    "title": "这几个高级前端常用的API，你用到了吗？",
+    "description": "MutationObserver 是一个可以监听 DOM 结构变化的接口。当 DOM 对象树发生任何变动时，MutationObserver 会得到通知。",
+    "url": "https://segmentfault.com/a/1190000040942225",
+    "author": "lzg9527",
+    "home_url": "https://segmentfault.com/u/michael_5c03399eed011",
+    "votes": "21",
     "rank": 23
   },
   {
@@ -215,15 +215,6 @@
     "votes": "20",
     "rank": 24
   },
-  {
-    "title": "前端Node.js面试题",
-    "description": "Node.js 是一个开源与跨平台的 JavaScript 运行时环境。在浏览器外运行 V8 JavaScript 引擎（Google Chrome 的内核），利用事件驱动、非阻塞和异步输入输出模型等技术提高性能。我们可以理解为：Node.js 就是一个...",
-    "url": "https://segmentfault.com/a/1190000040937008",
-    "author": "xiangzhihong",
-    "home_url": "https://segmentfault.com/u/xiangzhihong",
-    "votes": "15",
-    "rank": 25
-  },
   {
     "title": "Go 日常开发常备第三方库和工具",
     "description": "不知不觉写 Go 已经快一年了，上线了大大小小好几个项目；心态也经历了几轮变化。因为我个人大概前五年时间写的是 Java ，中途写过一年多的 Python，所以刚接触到 Go 时的感觉如下图：既没有 Java 的生态，也没有...",
@@ -231,7 +222,7 @@
     "author": "crossoverJie",
     "home_url": "https://segmentfault.com/u/crossoverjie",
     "votes": "15",
-    "rank": 26
+    "rank": 25
   },
   {
     "title": "正则表达式汇总",
@@ -240,16 +231,7 @@
     "author": "小蘑菇",
     "home_url": "https://segmentfault.com/u/xiaomogu_5f2124ad3ad42",
     "votes": "18",
-    "rank": 27
-  },
-  {
-    "title": "这几个高级前端常用的API，你用到了吗？",
-    "description": "MutationObserver 是一个可以监听 DOM 结构变化的接口。当 DOM 对象树发生任何变动时，MutationObserver 会得到通知。",
-    "url": "https://segmentfault.com/a/1190000040942225",
-    "author": "lzg9527",
-    "home_url": "https://segmentfault.com/u/michael_5c03399eed011",
-    "votes": "18",
-    "rank": 28
+    "rank": 26
   },
   {
     "title": "Vue 团队公开快如闪电的全新脚手架工具 create-vue，未来将替代 Vue-CLI，才300余行代码，学它！",
@@ -258,7 +240,7 @@
     "author": "若川",
     "home_url": "https://segmentfault.com/u/lxchuan12",
     "votes": "16",
-    "rank": 29
+    "rank": 27
   },
   {
     "title": "念念不忘，必有echo )))) ——讲述一个Typecho开源博客程序坚持 15 年的故事",
@@ -267,6 +249,24 @@
     "author": "sluke",
     "home_url": "https://segmentfault.com/u/sluke",
     "votes": "11",
+    "rank": 28
+  },
+  {
+    "title": "【一文秒懂】电商系统商品模块初建分析与设计",
+    "description": "创建《一文秒懂》这个专栏与以往《Grace development》和我博客的个人分享文章不同，我对《一文秒懂》这个专栏的定位是一个有态度，高标准的技术专栏，而《Grace development》我依旧会讲一些我们日常中会碰到的...",
+    "url": "https://segmentfault.com/a/1190000040855949",
+    "author": "CrazyCodes",
+    "home_url": "https://segmentfault.com/u/crazycodes",
+    "votes": "14",
+    "rank": 29
+  },
+  {
+    "title": "利用 CSS Overview 面板重构优化你的网站",
+    "description": "本文将向大家介绍 Chrome 87 开始支持的 CSS Overview Panel，并且介绍如何更好地利用这个面板。通过 CSS Overview Panel，可能可以帮助我们：",
+    "url": "https://segmentfault.com/a/1190000040837145",
+    "author": "chokcoco",
+    "home_url": "https://segmentfault.com/u/chokcoco",
+    "votes": "14",
     "rank": 30
   }
 ]