@wcj/github-rank 21.10.28 → 21.10.29

package/web/data/sifou-daily.json

@@ -1,146 +1,137 @@
 [
   {
-    "title": "灵光一闪！帮你使用Vue，搞定无法解决的“动态挂载”",
-    "description": "在一些特殊场景下，使用组件的时机无法确定，或者无法在Vue的template中确定要我们要使用的组件，这时就需要动态的挂载组件，或者使用运行时编译动态创建组件并挂载。",
-    "url": "https://segmentfault.com/a/1190000040870566",
-    "author": "葡萄城技术团队",
-    "home_url": "https://segmentfault.com/u/grapecity",
-    "votes": "1",
+    "title": "涉嫌抄袭？抖音前端技术团队发文致歉，承认借鉴Ant Design",
+    "description": "据描述，Semi Design 是由抖音前端团队，MED 产品设计团队设计、开发并维护的设计系统。它作为全面、易用、优质的现代企业级应用 UI 解决方案，是一款包含设计语言、React 组件、主题等开箱即用的中后台解决方案...",
+    "url": "https://segmentfault.com/a/1190000040877069",
+    "author": "snakesss",
+    "home_url": "https://segmentfault.com/u/snakesss",
+    "votes": "3",
     "rank": 1
   },
   {
-    "title": "7个关于\"this\"面试题，你知道几个？",
-    "description": "有梦想，有干货，微信搜索 【大迁世界】 关注这个在凌晨还在刷碗的刷碗智。本文 GitHub [链接] 已收录，有一线大厂面试完整考点、资料以及我的系列文章。",
-    "url": "https://segmentfault.com/a/1190000040869270",
-    "author": "前端小智",
-    "home_url": "https://segmentfault.com/u/minnanitkong",
-    "votes": "5",
+    "title": "大道至简，繁在人心：在浏览器控制台安装npm包是什么操作？",
+    "description": "我们都知道，npm 是 JavaScript 世界的包管理工具,并且是 Node.js 平台的默认包管理工具。通过 npm 可以安装、共享、分发代码,管理项目依赖关系。虽然作为命令行工具的 npm 近年来逐渐式微，但是作为广泛使用的存...",
+    "url": "https://segmentfault.com/a/1190000040875211",
+    "author": "独钓寒江雪",
+    "home_url": "https://segmentfault.com/u/king_hcj",
+    "votes": "11",
     "rank": 2
   },
   {
-    "title": "常见 SQL 面试题：经典 50 例",
-    "description": "多表连接: 内连接(省略默认inner) join ...on..左连接left join tableName as b on a.key ==b.key右连接right join 连接union(无重复(过滤去重))和union all(有重复[不过滤去重])",
-    "url": "https://segmentfault.com/a/1190000040874554",
-    "author": "民工哥",
-    "home_url": "https://segmentfault.com/u/jishuroad",
-    "votes": "2",
+    "title": "CSS，我可以写 if/else 语法了？",
+    "description": "有梦想，有干货，微信搜索 【大迁世界】 关注这个在凌晨还在刷碗的刷碗智。本文 GitHub [链接] 已收录，有一线大厂面试完整考点、资料以及我的系列文章。",
+    "url": "https://segmentfault.com/a/1190000040847047",
+    "author": "前端小智",
+    "home_url": "https://segmentfault.com/u/minnanitkong",
+    "votes": "1",
     "rank": 3
   },
   {
-    "title": "prettier 把我代码弄的很丑",
-    "description": "开篇一个小故事：近日组内多人反馈 eslint fix 后的代码很丑。我说我看看，然而 2 个月过去了，我都没有搞定。。。（老透明，想刷存在感。）又暴露了我的无知：是 eslint 修的，还是 prettier 修的这是什么奇怪的...",
-    "url": "https://segmentfault.com/a/1190000040873895",
-    "author": "混子的日常",
-    "home_url": "https://segmentfault.com/u/1023",
+    "title": "大厂面试题分享：如何让(a===1&&a===2&&a===3)的值为true?",
+    "description": "当我第一次看到这一题目的时候，我是比较震惊的，分析了下很不合我们编程的常理，并认为不大可能，变量a要在同一情况下要同时等于1，2和3这三个值，这是天方夜谭吧，不亚于哥德巴赫1+1=1的猜想吧，不过一切皆有可...",
+    "url": "https://segmentfault.com/a/1190000040880874",
+    "author": "wscats",
+    "home_url": "https://segmentfault.com/u/wscats",
     "votes": "2",
     "rank": 4
   },
   {
-    "title": "JZ-007-斐波那契数列",
-    "description": "大家都知道斐波那契数列，现在要求输入一个整数n，请你输出斐波那契数列的第n项（从0开始，第0项为0，第1项是1）。n<=39题目链接: 斐波那契数列",
-    "url": "https://segmentfault.com/a/1190000040870607",
+    "title": "JZ-008-跳台阶",
+    "description": "跳台阶题目描述一只青蛙一次可以跳上1级台阶，也可以跳上2级。求该青蛙跳上一个n级的台阶总共有多少种跳法（先后次序不同算不同的结果）题目链接: 跳台阶代码 {代码...} 【每日寄语】 你的微笑是最有治愈力的力量...",
+    "url": "https://segmentfault.com/a/1190000040875685",
     "author": "雄狮虎豹",
     "home_url": "https://segmentfault.com/u/xiongshihubao",
-    "votes": "3",
+    "votes": "2",
     "rank": 5
   },
   {
-    "title": "在 laravel 中轻松容易的输出完整的 sql 语句",
-    "description": "guanguans/laravel-dump-sql - 在 laravel 中轻松容易的输出完整的 sql 语句。laravel 中查询构造方法得到的 sql 语句没有绑定条件参数，类似于select * from users where id= ?。这个扩展包可辅助你获取完整的 s...",
-    "url": "https://segmentfault.com/a/1190000040871826",
-    "author": "guanguans",
-    "home_url": "https://segmentfault.com/u/guanguans",
+    "title": "在OneOS-Lite上学习搭建CI/CD流程(GitLab篇)",
+    "description": "嵌入式软件开发领域高频使用的开发语言是C语言，在大型项目开发中，我们往往会有格式审查、编译审查的需求。如果能借助GitLab平台实现代码的格式和编译问题审查，将会极大提高合入代码的规范性，把控新代码对原有...",
+    "url": "https://segmentfault.com/a/1190000040877695",
+    "author": "蓁蓁",
+    "home_url": "https://segmentfault.com/u/oneos",
     "votes": "1",
     "rank": 6
   },
   {
-    "title": "如何评价抖音前端开源的 Semi Design ？",
-    "description": "开头我是Peter抖音系企业应用设计系统 Semi Design 开源了，这是我今天听到最大的消息，于是晚上回家赶紧去看了看打开知乎，果然跟我想的一样，第一件事肯定有人否定这个开源的库，是基于别人的开源库改造而来甚...",
-    "url": "https://segmentfault.com/a/1190000040874775",
-    "author": "Peter谭老师",
-    "home_url": "https://segmentfault.com/u/jerrytanjinjie",
-    "votes": "1",
+    "title": "Netpoll导读",
+    "description": "要了解一个像Netty这样项目的源码是一件非常困难的事情。项目本身源码量大，涉及的底层知识多，加上利用了各种设计模式，都会对源码阅读增加难度。对于这样的工程最好是根据作者提供的导图先了解个大概，然后充分...",
+    "url": "https://segmentfault.com/a/1190000040879522",
+    "author": "byeane",
+    "home_url": "https://segmentfault.com/u/byeane",
+    "votes": "2",
     "rank": 7
   },
   {
-    "title": "Spring Framework 中文官方文档",
-    "description": "Spring Framework 中文官方文档目前为最新版 5.3.11。其他spring文档不断更新中1.历史、设计理念、反馈、入门。Overview2.IoC 容器、事件、资源、i18n、验证、数据绑定、类型转换、SpEL、AOP。Core3.模拟对象、Te...",
-    "url": "https://segmentfault.com/a/1190000040874034",
-    "author": "ztianlong",
-    "home_url": "https://segmentfault.com/u/ztianlong",
+    "title": "为什么要分库分表？",
+    "description": "前言在高并发系统当中，分库分表是必不可少的技术手段之一，同时也是 BAT 等大厂面试时，经常考的热门考题。你知道我们为什么要做分库分表吗？这个问题要从两条线说起：垂直方向 和 水平方向。1 垂直方向垂直方向...",
+    "url": "https://segmentfault.com/a/1190000040878163",
+    "author": "妍妍",
+    "home_url": "https://segmentfault.com/u/_6175053e57aec",
     "votes": "1",
     "rank": 8
   },
   {
-    "title": "分辨率越高清晰度越高吗？",
-    "description": "显示屏清晰度对于计算机上显示的文字和图片，正常来说显示器分辨率越高清晰度就会更高，不过有时我们切换一些超高分辨率后也识别不出差异，这是为什么？简单来说显示清晰度由物理因素和视力因素。物理因素就是设...",
-    "url": "https://segmentfault.com/a/1190000040873601",
-    "author": "编程码农",
-    "home_url": "https://segmentfault.com/u/onlythinking",
-    "votes": "3",
+    "title": "JavaScript栈思想的应用：实现智能重复函数",
+    "description": "需求：实现一个“智能重复”函数，实现下面字符串的转换 {代码...} 思路及原理原理：使用“栈”思想来实现，在JavaScript中实现“栈”的最好数据结构是数组思路：1、定义两个栈（数组），栈1（stack1）、栈2（stack2）...",
+    "url": "https://segmentfault.com/a/1190000040877623",
+    "author": "heath_learning",
+    "home_url": "https://segmentfault.com/u/heath_learning",
+    "votes": "1",
     "rank": 9
   },
   {
-    "title": "前端公共模块替换",
-    "description": "公司中后台管理系统经历几年的迭代维护，其公共模块部分（Header、Slider）的主题与现在UI风格不一致，需要更换。但是，该项目几年前的老项目了，技术栈在逐步的演进，初始是Freemaker引擎搭建的前后端未分离项目...",
-    "url": "https://segmentfault.com/a/1190000040873491",
-    "author": "记得要微笑",
-    "home_url": "https://segmentfault.com/u/tosmile",
+    "title": "CSS 奇技淫巧 | 巧妙实现文字二次加粗再加边框",
+    "description": "本文将通过一个实际的业务需求，讲解如何实现极端场景下文字加粗加边框效果文字多重边框的效果需求背景 - 文字的二次加粗今天遇到这样一个有意思的问题：在文字展示的时候，利用了 font-weight: bold 给文字进行...",
+    "url": "https://segmentfault.com/a/1190000040876086",
+    "author": "chokcoco",
+    "home_url": "https://segmentfault.com/u/chokcoco",
     "votes": "1",
     "rank": 10
   },
   {
-    "title": "技术期刊 · 白日照耀开鸿蒙 | 深入鸿蒙 ACE UI 框架解析;无限循环的 useEffect 类型……",
-    "description": "清气升，浊气降，事物发展总会遵循一定的规律，就好像 react hooks 更加简洁易的同时，也可能会有隐患；人工智能也会随着时间的流逝逐步渗透到我们日常开发，成为解决问题的一大利器；而鸿蒙正式发布之后吸引了大...",
-    "url": "https://segmentfault.com/a/1190000040870102",
-    "author": "凹凸实验室",
-    "home_url": "https://segmentfault.com/u/o2team",
-    "votes": "1",
+    "title": "纯净搭建简历工具",
+    "description": "通常来说，我们更希望自己的简历显示出自己的个性，除了使用文档编辑，网上有很多现成的模板，同时也提供了相对自由的编辑环境，但是往往到了最后一步导出的时候，会提示扫码、会员、付费等绑定操作，看着自己的...",
+    "url": "https://segmentfault.com/a/1190000040876018",
+    "author": "stonehank",
+    "home_url": "https://segmentfault.com/u/stonehank",
+    "votes": "2",
     "rank": 11
   },
   {
-    "title": "一文读懂 Go sync.Cond 设计",
-    "description": "Go 语言通过 go 关键字开启 goroutine 让开发者可以轻松地实现并发编程，而并发程序的有效运行，往往离不开 sync 包的保驾护航。目前，sync 包的赋能列表包括： sync.atomic 下的原子操作、sync.Map 并发安全 map...",
-    "url": "https://segmentfault.com/a/1190000040874443",
-    "author": "机器铃砍菜刀",
-    "home_url": "https://segmentfault.com/u/jiqilingkancaidao",
+    "title": "TransX 一个小巧玲珑的 vue 组件切换动画库",
+    "description": "TNTWeb - 全称腾讯新闻前端团队，组内小伙伴在Web前端、NodeJS开发、UI设计、移动APP等大前端领域都有所实践和积累。目前团队主要支持腾讯新闻各业务的前端开发，业务开发之余也积累沉淀了一些前端基础设施，赋能...",
+    "url": "https://segmentfault.com/a/1190000040879529",
+    "author": "TNTWEB",
+    "home_url": "https://segmentfault.com/u/tnfe",
     "votes": "1",
     "rank": 12
   },
   {
-    "title": "Git清空提交记录",
-    "description": "公开仓库有时候不小心把敏感信息带上去了，而且乱七八糟的提交记录比较多，索性直接清空。在网页把仓库清空本地切换到新的分支git checkout --orphan latest_branch缓存所有文件git add .提交跟踪过的文件git com...",
-    "url": "https://segmentfault.com/a/1190000040874225",
-    "author": "二毛",
-    "home_url": "https://segmentfault.com/u/erma0",
-    "votes": "1",
+    "title": "前端必会的nginx（配置可视化）",
+    "description": "1.介绍Nginx（发音同“engine X”）是异步框架的web服务器，也可以用作反向代理、负载平衡器和HTTP缓存。特点：和node类似，Nginx使用异步事件驱动的方法来处理请求，适合处理io密集型场景前端为什么要学：测试环境...",
+    "url": "https://segmentfault.com/a/1190000040879096",
+    "author": "Runningfyy",
+    "home_url": "https://segmentfault.com/u/yangkaiqiang",
+    "votes": "2",
     "rank": 13
   },
   {
-    "title": "终于有人把云原生存储讲明白了",
-    "description": "云原生是一种开发和运行软件应用程序的新范式，它融合了云计算、容器化、Serverless 和微服务等技术趋势。云原生存储是一种旨在用于云原生环境的存储技术。",
-    "url": "https://segmentfault.com/a/1190000040872231",
-    "author": "青云技术社区",
-    "home_url": "https://segmentfault.com/u/qingclouddevelopers",
+    "title": "北京|上市教育职业集团年薪40-60万诚聘前端讲师",
+    "description": "依靠 \"口碑\" 招生 （70% 的学员来自老学员推荐）；发展前景有兴趣做成就他人而快乐自己的老师吗？我们是国内第一家上市的成人职业教育集团，平台大，发展广，职业教育老师没有35岁焦虑。讲师是起步，后续可以做课...",
+    "url": "https://segmentfault.com/a/1190000040875342",
+    "author": "张鹏",
+    "home_url": "https://segmentfault.com/u/zhangpeng_6179f90d51ae3",
     "votes": "1",
     "rank": 14
   },
   {
-    "title": "Java 开发最容易写的 10 个bug",
-    "description": "作为 Java 开发，我们在写代码的过程中难免会产生各种奇思妙想的 bug ，有些 bug 就挺让人无奈的，比如说各种空指针异常，在 ArrayList 的迭代中进行删除操作引发异常，数组下标越界异常等。",
-    "url": "https://segmentfault.com/a/1190000040871114",
-    "author": "诚信共赢",
-    "home_url": "https://segmentfault.com/u/chengxingongying",
+    "title": "听说你的对象有个”环“？怎么发现的呢？",
+    "description": "1. 手写62+方法学习JavaScript底层原理判断一个对象是否存在循环引用已收录至 手写各种源码实现，也可以直接点击isCyclic快速查看，目前已有62+手写实现，欢迎一起来学习喔。2. 不得不说的循环引用如下图: 相信曾...",
+    "url": "https://segmentfault.com/a/1190000040875138",
+    "author": "前端胖头鱼",
+    "home_url": "https://segmentfault.com/u/116263",
     "votes": "1",
     "rank": 15
-  },
-  {
-    "title": "Go 凭什么不支持三元运算符？",
-    "description": "大家好，我是煎鱼。这是一个很多其他语言工程师转 Go 语言的时间节点，这就难免不论一番比较。其中一个经典的运算上的就是 “三元运算符”：为什么 Go 语言不支持三元运算符，Go 不支持三元运算符就是设计的不好，...",
-    "url": "https://segmentfault.com/a/1190000040871004",
-    "author": "煎鱼",
-    "home_url": "https://segmentfault.com/u/eddycjy",
-    "votes": "1",
-    "rank": 16
   }
 ]

package/web/data/sifou-monthly.json

@@ -5,7 +5,7 @@
     "url": "https://segmentfault.com/a/1190000040777100",
     "author": "前端胖头鱼",
     "home_url": "https://segmentfault.com/u/116263",
-    "votes": "55",
+    "votes": "57",
     "rank": 1
   },
   {
@@ -14,7 +14,7 @@
     "url": "https://segmentfault.com/a/1190000040797816",
     "author": "y_ck",
     "home_url": "https://segmentfault.com/u/user_ngjv5fmp",
-    "votes": "45",
+    "votes": "46",
     "rank": 2
   },
   {
@@ -32,7 +32,7 @@
     "url": "https://segmentfault.com/a/1190000040747951",
     "author": "前端胖头鱼",
     "home_url": "https://segmentfault.com/u/116263",
-    "votes": "41",
+    "votes": "42",
     "rank": 4
   },
   {
@@ -44,15 +44,6 @@
     "votes": "42",
     "rank": 5
   },
-  {
-    "title": "CSS 奇技淫巧 | 妙用混合模式实现文字镂空波浪效果",
-    "description": "本文将介绍一个小技巧，通过混合模式 mix-blend-mode 巧妙的实现文字的镂空波浪效果。起因一日，一群友私聊问我。如何使用 CSS 实现下述效果，一个文字的波浪效果：我当时想都没想，就回答道，这个很简单啊。熟练...",
-    "url": "https://segmentfault.com/a/1190000040741939",
-    "author": "chokcoco",
-    "home_url": "https://segmentfault.com/u/chokcoco",
-    "votes": "29",
-    "rank": 6
-  },
   {
     "title": "📝 没 2 年 React Native 开发经验，你都遇不到这些坑",
     "description": "React Native 开发时，如果只是写些简单的页面，基本上按着官方文档 reactnative.dev就能写出来，但是 React Native 的 API 有几百个，没有一定的开发踩坑经验，面对一些新的需求时确实会抓不到重点。",
@@ -60,7 +51,7 @@
     "author": "卤代烃",
     "home_url": "https://segmentfault.com/u/skychx",
     "votes": "28",
-    "rank": 7
+    "rank": 6
   },
   {
     "title": "50天用react.js重写50个web项目，我学到了什么？",
@@ -69,7 +60,7 @@
     "author": "夕水",
     "home_url": "https://segmentfault.com/u/xishui_5ac9a340a5484",
     "votes": "29",
-    "rank": 8
+    "rank": 7
   },
   {
     "title": "就因为这三个知识点，我彻底学废了”正则表达式“",
@@ -77,8 +68,8 @@
     "url": "https://segmentfault.com/a/1190000040846926",
     "author": "前端胖头鱼",
     "home_url": "https://segmentfault.com/u/116263",
-    "votes": "25",
-    "rank": 9
+    "votes": "26",
+    "rank": 8
   },
   {
     "title": "前端如何防止用户修改水印？",
@@ -87,7 +78,7 @@
     "author": "劉凯里",
     "home_url": "https://segmentfault.com/u/kyrieliu",
     "votes": "21",
-    "rank": 10
+    "rank": 9
   },
   {
     "title": "写个vscode插件, 帮助阅读i18n项目的代码",
@@ -95,8 +86,8 @@
     "url": "https://segmentfault.com/a/1190000040773678",
     "author": "lulu_up",
     "home_url": "https://segmentfault.com/u/lulu_up",
-    "votes": "26",
-    "rank": 11
+    "votes": "27",
+    "rank": 10
   },
   {
     "title": "CSS 奇技淫巧 | 妙用 drop-shadow 实现线条光影效果",
@@ -105,7 +96,7 @@
     "author": "chokcoco",
     "home_url": "https://segmentfault.com/u/chokcoco",
     "votes": "26",
-    "rank": 12
+    "rank": 11
   },
   {
     "title": "使用 CSS Scroll Snap 优化滚动，提升用户体验！",
@@ -114,7 +105,7 @@
     "author": "前端小智",
     "home_url": "https://segmentfault.com/u/minnanitkong",
     "votes": "24",
-    "rank": 13
+    "rank": 12
   },
   {
     "title": "2021 VSCode前端插件推荐",
@@ -123,7 +114,7 @@
     "author": "风不识途",
     "home_url": "https://segmentfault.com/u/tudou_5e2d76940fbaa",
     "votes": "24",
-    "rank": 14
+    "rank": 13
   },
   {
     "title": "【中高级前端】必备，30+高频手写题及详细答案(万字长文)，看“你”怎么难倒我",
@@ -132,7 +123,7 @@
     "author": "前端胖头鱼",
     "home_url": "https://segmentfault.com/u/116263",
     "votes": "22",
-    "rank": 15
+    "rank": 14
   },
   {
     "title": "20 个值得学习的 Vue 开源项目",
@@ -140,9 +131,27 @@
     "url": "https://segmentfault.com/a/1190000040803238",
     "author": "前端小智",
     "home_url": "https://segmentfault.com/u/minnanitkong",
-    "votes": "16",
+    "votes": "18",
+    "rank": 15
+  },
+  {
+    "title": "7分钟学会写一个浏览器插件——突破某SDN未登录禁止复制的限制",
+    "description": "严格意义上说，本篇文章要讨论的应该是 “Chrome 扩展(Extension)”而不是“Chrome 插件（Plugins）”，大家不妨先思考一个问题：“浏览器插件”和“浏览器扩展”之间有什么区别？如果您对此感到厌烦，不妨直接跳过此小节...",
+    "url": "https://segmentfault.com/a/1190000040824814",
+    "author": "独钓寒江雪",
+    "home_url": "https://segmentfault.com/u/king_hcj",
+    "votes": "21",
     "rank": 16
   },
+  {
+    "title": "前端如何实现token的无感刷新",
+    "description": "通常，对于一些需要记录用户行为的系统，在进行网络请求的时候都会要求传递一下登录的token。不过，为了接口数据的安全，服务器的token一般不会设置太长，根据需要一般是1-7天的样子，token过期后就需要重新登录...",
+    "url": "https://segmentfault.com/a/1190000040850857",
+    "author": "xiangzhihong",
+    "home_url": "https://segmentfault.com/u/xiangzhihong",
+    "votes": "24",
+    "rank": 17
+  },
   {
     "title": "MySQL灵魂拷问：36题带你面试通关",
     "description": "大家好，我是大彬~今天给大家分享MySQL常考的面试题，看看你们能答对多少。本期MySQL面试题的目录如下：事务的四大特性？事务隔离级别有哪些？索引什么是索引？索引的优缺点？索引的作用？什么情况下需要建索引？...",
@@ -150,15 +159,6 @@
     "author": "程序员大彬",
     "home_url": "https://segmentfault.com/u/5n7qfpo1",
     "votes": "19",
-    "rank": 17
-  },
-  {
-    "title": "7分钟学会写一个浏览器插件——突破某SDN未登录禁止复制的限制",
-    "description": "严格意义上说，本篇文章要讨论的应该是 “Chrome 扩展(Extension)”而不是“Chrome 插件（Plugins）”，大家不妨先思考一个问题：“浏览器插件”和“浏览器扩展”之间有什么区别？如果您对此感到厌烦，不妨直接跳过此小节...",
-    "url": "https://segmentfault.com/a/1190000040824814",
-    "author": "独钓寒江雪",
-    "home_url": "https://segmentfault.com/u/king_hcj",
-    "votes": "20",
     "rank": 18
   },
   {
@@ -179,6 +179,15 @@
     "votes": "13",
     "rank": 20
   },
+  {
+    "title": "前端应该知道的：开放图谱协议（The Open Graph protocol）",
+    "description": "Open Graph 是一种互联网协议，最初由 Facebook 创建，用于标准化网页中元数据的使用，使得社交媒体得以以丰富的“图形”对象来表示共享的页面内容。",
+    "url": "https://segmentfault.com/a/1190000040863000",
+    "author": "独钓寒江雪",
+    "home_url": "https://segmentfault.com/u/king_hcj",
+    "votes": "18",
+    "rank": 21
+  },
   {
     "title": "聊聊开发日常的效率提升工具（全）",
     "description": "前言：日常开发中，好的工具往往能让我们事半功倍，有句老话说得好：工欲善其事，必先利其器。使用高效率的工具可以极大提升我们的开发效率。接下来分享下树酱平时开发中经常使用的一些效率工具",
@@ -186,7 +195,7 @@
     "author": "树酱",
     "home_url": "https://segmentfault.com/u/shu_jshu_jiashu_jianshu_jiang",
     "votes": "13",
-    "rank": 21
+    "rank": 22
   },
   {
     "title": "计算机网络经典20问！",
@@ -195,7 +204,7 @@
     "author": "程序员大彬",
     "home_url": "https://segmentfault.com/u/5n7qfpo1",
     "votes": "13",
-    "rank": 22
+    "rank": 23
   },
   {
     "title": "前端实现很哇塞的浏览器端扫码功能🌟",
@@ -203,15 +212,6 @@
     "url": "https://segmentfault.com/a/1190000040809122",
     "author": "dragonir",
     "home_url": "https://segmentfault.com/u/dragonir",
-    "votes": "19",
-    "rank": 23
-  },
-  {
-    "title": "前端如何实现token的无感刷新",
-    "description": "通常，对于一些需要记录用户行为的系统，在进行网络请求的时候都会要求传递一下登录的token。不过，为了接口数据的安全，服务器的token一般不会设置太长，根据需要一般是1-7天的样子，token过期后就需要重新登录...",
-    "url": "https://segmentfault.com/a/1190000040850857",
-    "author": "xiangzhihong",
-    "home_url": "https://segmentfault.com/u/xiangzhihong",
     "votes": "20",
     "rank": 24
   },
@@ -233,24 +233,33 @@
     "votes": "14",
     "rank": 26
   },
-  {
-    "title": "前端应该知道的：开放图谱协议（The Open Graph protocol）",
-    "description": "Open Graph 是一种互联网协议，最初由 Facebook 创建，用于标准化网页中元数据的使用，使得社交媒体得以以丰富的“图形”对象来表示共享的页面内容。",
-    "url": "https://segmentfault.com/a/1190000040863000",
-    "author": "独钓寒江雪",
-    "home_url": "https://segmentfault.com/u/king_hcj",
-    "votes": "17",
-    "rank": 27
-  },
   {
     "title": "66道前端算法面试题附思路分析助你查漏补缺",
     "description": "本部分主要是 CavsZhouyou 在练习《剑指 Offer》时所做的笔记，主要涉及算法相关知识和一些相关面试题时所做的笔记，分享这份总结给大家，帮助大家对算法的可以来一次全方位的检漏和排查，",
     "url": "https://segmentfault.com/a/1190000040797373",
     "author": "wscats",
     "home_url": "https://segmentfault.com/u/wscats",
-    "votes": "12",
+    "votes": "13",
+    "rank": 27
+  },
+  {
+    "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": "13",
     "rank": 28
   },
+  {
+    "title": "今天推荐，今年排名前 15 的 Vue 后台管理模板",
+    "description": "有梦想，有干货，微信搜索 【大迁世界】 关注这个在凌晨还在刷碗的刷碗智。本文 GitHub [链接] 已收录，有一线大厂面试完整考点、资料以及我的系列文章。",
+    "url": "https://segmentfault.com/a/1190000040814521",
+    "author": "前端小智",
+    "home_url": "https://segmentfault.com/u/minnanitkong",
+    "votes": "13",
+    "rank": 29
+  },
   {
     "title": "前端代码评审通常注意些什么",
     "description": "代码评审又称为（Code Review，简称CR），关于CR，开发同学其实都不陌生，现在大部分公司的项目开发流程中，它都是必不可少的一个环节，CR的好处也都耳熟能详。不同的公司对于CR的方式、质量要求标准都不一样。这...",
@@ -258,15 +267,6 @@
     "author": "_Vin",
     "home_url": "https://segmentfault.com/u/_vin_5d884143cd4cb",
     "votes": "9",
-    "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": "12",
     "rank": 30
   }
 ]