@wcj/github-rank 22.8.9 → 22.8.12

package/dist/sifou-daily.json

@@ -1,83 +1,92 @@
 [
   {
-    "title": "使用 CSS 构建强大且酷炫的粒子动画",
-    "description": "当然，不使用 HTML + CSS 的主要原因在于，粒子动画通常需要较多的粒子，而如果使用 HTML + CSS 的话势必需要过多的 DOM 元素，这也就导致了使用 HTML + CSS 构建的粒子动画在性能上毫无优势。",
-    "url": "https://segmentfault.com/a/1190000042283578",
-    "author": "chokcoco",
-    "home_url": "https://segmentfault.com/u/chokcoco",
-    "votes": "9",
+    "title": "Wuzzle，进行基于 webpack 的 JS 转译",
+    "description": "转译器（transpiler）是指能够进行文件到文件一对一转换的编译器（compiler）。在 JS 世界中，常见的开箱即可用的转译器有 typescript cli、babel cli 等，但他们一般只处理 .js、.ts 等脚本文件。而 webpack 尽...",
+    "url": "https://segmentfault.com/a/1190000042306044",
+    "author": "乌柏木",
+    "home_url": "https://segmentfault.com/u/wubomu",
+    "votes": "14",
     "rank": 1
   },
   {
-    "title": "可视化拖拽组件库一些技术要点原理分析（四）",
-    "description": "本文是可视化拖拽系列的第四篇，比起之前的三篇文章，这篇功能点要稍微少一点，总共有五点：SVG 组件动态属性面板数据来源（接口请求）组件联动组件按需加载如果你对我之前的系列文章不是很了解，建议先把这三篇...",
-    "url": "https://segmentfault.com/a/1190000042282658",
-    "author": "谭光志",
-    "home_url": "https://segmentfault.com/u/woai3c",
-    "votes": "5",
+    "title": "终于新增了：查看所有测试历史的功能，我有点迫不及待了",
+    "description": "当然，在现版本（V 1.3.0）之前也有查看测试历史功能，但彼时测试历史跟随 API 信息，每个 API 有自己的测试历史，这样就会遇到两个方面的问题：",
+    "url": "https://segmentfault.com/a/1190000042301443",
+    "author": "猿计划",
+    "home_url": "https://segmentfault.com/u/yuanjihua_5d954fd2a3238",
+    "votes": "3",
     "rank": 2
   },
   {
-    "title": "面向推荐的汽车知识图谱构建",
-    "description": "知识图谱的概念，最早由 Google 在2012 年提出， 旨在实现更智能的搜索引擎，并在2013年之后开始在学术界和工业级普及。目前，随着人工智能技术的高速发展，知识图谱已广泛应用于搜索、推荐、广告、风控、智能调...",
-    "url": "https://segmentfault.com/a/1190000042287137",
-    "author": "之家技术",
-    "home_url": "https://segmentfault.com/u/zhijiajishu",
-    "votes": "7",
+    "title": "请求体格式有哪些呢？我总结常见的这几种",
+    "description": "Form-data有两种格式的 Form-data（表单数据），multipart/form-data 和 application/x-www-form-urlencoded;",
+    "url": "https://segmentfault.com/a/1190000042301806",
+    "author": "气势凌人的柿子",
+    "home_url": "https://segmentfault.com/u/qishilingrendeshizi",
+    "votes": "2",
     "rank": 3
   },
   {
-    "title": "基于微信云开发的幼儿园招生报名小程序",
-    "description": "园方人员根据资料可以做预先审核，并提示用户修改完善资料，并可查看和导出名单Excel，审核报名记录等，大大减少了现场报名的人力成本，数字化手段提高了工作效率， 也为家长节省了时间。",
-    "url": "https://segmentfault.com/a/1190000042284989",
-    "author": "CC同学呀",
-    "home_url": "https://segmentfault.com/u/ccxiaoyoulu",
-    "votes": "1",
+    "title": "🔬 一文搞懂前端兼容问题",
+    "description": "对于大部分开发者来说，版本兼容是一件存在感很低的事情，因为它在绝大部分情况下都是一行配置，在一些前端工具链（例如 Babel、CoreJS，Autoprefixer 等工具）的帮助下适配到目标浏览器，只会在一些大的 break c...",
+    "url": "https://segmentfault.com/a/1190000042301384",
+    "author": "卤代烃",
+    "home_url": "https://segmentfault.com/u/skychx",
+    "votes": "3",
     "rank": 4
   },
   {
-    "title": "记录遇到的mongoDb问题, 以及restTemplate请求重试",
-    "description": "最近使用mongDb的时候，出现了一些问题。mongoDb 实体id自增在保存实体的时候报了这个错Cannot aotogenerate id of type java.lang.Long for entity即 不能自动生成id之后就带着报错去谷歌了一下。 得到了如下结...",
-    "url": "https://segmentfault.com/a/1190000042287505",
-    "author": "weiewiyi",
-    "home_url": "https://segmentfault.com/u/chenchu_6110ed583800c",
+    "title": "又更新了！新版本 V 1.3.0 发布了，新增：前后置脚本、查看所有测试历史、国际化...",
+    "description": "Eoapi V 1.3.0 版本功能终于在这个夏天发布了，UI 进行了升级，更清爽、更简单。看出来哪里改动了吗？发布了几个大功能：系统、插件多语言支持测试支持前后置 Javascript 脚本，支持加解密、断言、全局变量等等功...",
+    "url": "https://segmentfault.com/a/1190000042301399",
+    "author": "猿计划",
+    "home_url": "https://segmentfault.com/u/yuanjihua_5d954fd2a3238",
     "votes": "2",
     "rank": 5
   },
   {
-    "title": "mongoDb查询中遇到的问题",
-    "description": "返回的数据样式：可以看到这样查询后会将从表查询到的数据添加到主表数据中，也就是说在mongoDb中并不需要在实体中加入关联实体，只需加入关联实体的Id即可。如果还想要加入其他查询条件，只需像下面这样加入crit...",
-    "url": "https://segmentfault.com/a/1190000042283317",
-    "author": "李明",
-    "home_url": "https://segmentfault.com/u/crister_612f55567eb8c",
-    "votes": "2",
+    "title": "Vue仿钉钉审批流程",
+    "description": "workflow钉钉审批流程设置workflow钉钉审批流程设置，基于vue开发。QQ交流群：639251756线上开源地址 https://github.com/StavinLi/Workflow github点个星吧！预览地址 https://stavinli.github.io/Workflow/dist...",
+    "url": "https://segmentfault.com/a/1190000042300972",
+    "author": "xiangzhihong",
+    "home_url": "https://segmentfault.com/u/xiangzhihong",
+    "votes": "4",
     "rank": 6
   },
   {
-    "title": "[开源项目]可观测、易使用的SpringBoot线程池",
-    "description": "在开发spring boot应用服务的时候，难免会使用到异步任务及线程池。spring boot的线程池是可以自定义的，所以我们经常会在项目里面看到类似于下面这样的代码",
-    "url": "https://segmentfault.com/a/1190000042284199",
-    "author": "字母哥博客",
-    "home_url": "https://segmentfault.com/u/zimug",
-    "votes": "1",
+    "title": "如何在BI中增加“路线地图”并进行数据分析？",
+    "description": "随着客户的需求越来越“百变”，最近在做大屏设计的葡萄陷入了困境。近期客户提出的需求是想在BI工具中增加 “路线地图”展示功能并进行数据分析。不仅如此，这个“路线地图”还要兼具实用的功能与美观的动效，典型的“...",
+    "url": "https://segmentfault.com/a/1190000042304159",
+    "author": "葡萄城技术团队",
+    "home_url": "https://segmentfault.com/u/grapecity",
+    "votes": "2",
     "rank": 7
   },
   {
-    "title": "精读《Unique, MapTypes, Construct Tuple...》",
-    "description": "去重需要不断递归产生去重后结果，因此需要一个辅助变量 R 配合，并把 T 用 infer 逐一拆解，判断第一个字符是否在结果数组里，如果不在就塞进去：",
-    "url": "https://segmentfault.com/a/1190000042282563",
-    "author": "黄子毅",
-    "home_url": "https://segmentfault.com/u/aoyangyudakong",
-    "votes": "1",
+    "title": "既是开源又是国产的 api 管理工具，我推荐这个",
+    "description": "作为新入行的开发者，对 API 测试工具并没有了解那么多,一番搜索对比后，再问问周围的开发朋友，也逐渐知道对我而言什么样的 API 接口测试工具更适合我，我觉得它得满足以下几点：",
+    "url": "https://segmentfault.com/a/1190000042301179",
+    "author": "气势凌人的柿子",
+    "home_url": "https://segmentfault.com/u/qishilingrendeshizi",
+    "votes": "2",
     "rank": 8
   },
   {
-    "title": "JavaScript WebGL 绘制顺序",
-    "description": "引子在 JavaScript WebGL 三维相关概念中尝试一些效果的时候，又碰到了新问题，就去查了资料，自己尝试后总结下。OriginMy GitHub绘制顺序之前二维绘制顺序并没有产生明显的不好效果，现在绘制三维影响就比较大了...",
-    "url": "https://segmentfault.com/a/1190000042282536",
-    "author": "XXHolic",
-    "home_url": "https://segmentfault.com/u/xxholic",
+    "title": "vue项目点击按钮获取手机验证码开始倒计时，并且页面刷新秒数不会被初始化",
+    "description": "vue项目点击按钮获取手机验证码倒计时，并且页面刷新秒数不会被初始化。原理使用了sessionStorage，下面是代码： {代码...} 如果页面被关闭也想让倒计时生效，使用localStorage就可以了。",
+    "url": "https://segmentfault.com/a/1190000042304420",
+    "author": "我的一个道姑朋友",
+    "home_url": "https://segmentfault.com/u/wodeyigedaogupengyou",
     "votes": "1",
     "rank": 9
+  },
+  {
+    "title": "图扑数字孪生青岛城轨，赋能智慧交通低碳发展",
+    "description": "始于出行，融于生活。“双碳”战略目标的提出，为智慧城市建设创造了新的机遇，智慧交通作为城市引导承载低碳出行的骨干交通方式，已成为当今时代各地区作为推进城市高质量发展的重要目标。",
+    "url": "https://segmentfault.com/a/1190000042301291",
+    "author": "hightopo",
+    "home_url": "https://segmentfault.com/u/hightopo",
+    "votes": "1",
+    "rank": 10
   }
 ]

package/dist/sifou-monthly.json

@@ -1,4 +1,13 @@
 [
+  {
+    "title": "提升web输入体验！JS 如何自动配对标点符号？",
+    "description": "欢迎关注微信公众号前端侦探温馨提示：在阅读本文之前，可以先回顾这篇文章：Web 中的“选区”和“光标”，有很多你可能不太知道的原生 API，以下内容是对该内容的实践运用在写作编辑中，有很多需要成对出现的标点符...",
+    "url": "https://segmentfault.com/a/1190000042251637",
+    "author": "XboxYan",
+    "home_url": "https://segmentfault.com/u/xboxyan",
+    "votes": "22",
+    "rank": 1
+  },
   {
     "title": "圆角大杀器，使用滤镜构建圆角及波浪效果",
     "description": "本文，将另辟蹊径，介绍一种使用滤镜去构建圆角的独特方式。首先，我们来看这样一个图形：一个矩形，没什么特别的，代码如下： {代码...} 如果，我们现在需要给这个矩形的两端加上圆角，像是这样，该怎么做呢：So...",
@@ -6,7 +15,7 @@
     "author": "chokcoco",
     "home_url": "https://segmentfault.com/u/chokcoco",
     "votes": "22",
-    "rank": 1
+    "rank": 2
   },
   {
     "title": "超酷炫的转场动画？CSS 轻松拿下！",
@@ -14,53 +23,53 @@
     "url": "https://segmentfault.com/a/1190000042184211",
     "author": "chokcoco",
     "home_url": "https://segmentfault.com/u/chokcoco",
-    "votes": "21",
-    "rank": 2
-  },
-  {
-    "title": "提升web输入体验！JS 如何自动配对标点符号？",
-    "description": "欢迎关注微信公众号前端侦探温馨提示：在阅读本文之前，可以先回顾这篇文章：Web 中的“选区”和“光标”，有很多你可能不太知道的原生 API，以下内容是对该内容的实践运用在写作编辑中，有很多需要成对出现的标点符...",
-    "url": "https://segmentfault.com/a/1190000042251637",
-    "author": "XboxYan",
-    "home_url": "https://segmentfault.com/u/xboxyan",
-    "votes": "17",
+    "votes": "22",
     "rank": 3
   },
   {
-    "title": "动画合成小技巧！CSS 实现动感的倒计时效果",
-    "description": "欢迎关注微信公众号： 前端侦探介绍一个 CSS 动画合成小技巧。先看效果这是一个非常“动感”的倒计时效果，通常在一些活动开场中比较常见，分析一下整个动画过程，不难发现，有以下几类动画数字的变化缩小和放大透...",
-    "url": "https://segmentfault.com/a/1190000042094549",
+    "title": "CSS color-scheme 和夜间模式",
+    "description": "欢迎关注微信公众号：前端侦探介绍一个和深色模式相关的CSS属性：color-scheme一、什么是 color-scheme？color-scheme顾名思义，即为“配色方案”，在系统中指的是“白天模式”和“夜间模式”。使用这个属性可以轻松的...",
+    "url": "https://segmentfault.com/a/1190000042184163",
     "author": "XboxYan",
     "home_url": "https://segmentfault.com/u/xboxyan",
-    "votes": "21",
+    "votes": "19",
     "rank": 4
   },
   {
-    "title": "高阶切图技巧！基于单张图片的任意颜色转换",
-    "description": "今天，要介绍一种基于 CSS mask-composite 的高级技巧。通过掌握它，我们可以通过一张 图片，得到关于它的各种变换，甚至乎，得到各种不同颜色的变换。通过单张 PNG/SVG 得到它的反向切图事情的经过是这样的，某...",
-    "url": "https://segmentfault.com/a/1190000042093361",
+    "title": "使用 CSS 构建强大且酷炫的粒子动画",
+    "description": "当然，不使用 HTML + CSS 的主要原因在于，粒子动画通常需要较多的粒子，而如果使用 HTML + CSS 的话势必需要过多的 DOM 元素，这也就导致了使用 HTML + CSS 构建的粒子动画在性能上毫无优势。",
+    "url": "https://segmentfault.com/a/1190000042283578",
     "author": "chokcoco",
     "home_url": "https://segmentfault.com/u/chokcoco",
-    "votes": "14",
+    "votes": "18",
     "rank": 5
   },
   {
-    "title": "CSS color-scheme 和夜间模式",
-    "description": "欢迎关注微信公众号：前端侦探介绍一个和深色模式相关的CSS属性：color-scheme一、什么是 color-scheme？color-scheme顾名思义，即为“配色方案”，在系统中指的是“白天模式”和“夜间模式”。使用这个属性可以轻松的...",
-    "url": "https://segmentfault.com/a/1190000042184163",
-    "author": "XboxYan",
-    "home_url": "https://segmentfault.com/u/xboxyan",
-    "votes": "17",
+    "title": "妙用 CSS 构建花式透视背景效果",
+    "description": "本文将介绍一种巧用 background 配合 backdrop- filter 来构建有趣的透视背景效果的方式。本技巧源自于一名群友的提问，如何构建如 ElementUI 文档的一种顶栏背景特效，看看效果：仔细看，在页面的的滚动过程中，...",
+    "url": "https://segmentfault.com/a/1190000042267425",
+    "author": "chokcoco",
+    "home_url": "https://segmentfault.com/u/chokcoco",
+    "votes": "20",
     "rank": 6
   },
+  {
+    "title": "防御式CSS是什么？这几点属性重点防御！",
+    "description": "微信搜索 【大迁世界】, 我会第一时间和你分享前端行业趋势，学习途径等等。本文 GitHub [链接] 已收录，有一线大厂面试完整考点、资料以及我的系列文章。",
+    "url": "https://segmentfault.com/a/1190000042272755",
+    "author": "前端小智",
+    "home_url": "https://segmentfault.com/u/minnanitkong",
+    "votes": "18",
+    "rank": 7
+  },
   {
     "title": "利用噪声构建美妙的 CSS 图形",
     "description": "在平时，我非常喜欢利用 CSS 去构建一些有意思的图形。我们首先来看一个简单的例子。首先，假设我们实现一个 10x10 的格子：此时，我们可以利用一些随机效果，优化这个图案。譬如，我们给它随机添加不同的颜色：...",
     "url": "https://segmentfault.com/a/1190000042103702",
     "author": "chokcoco",
     "home_url": "https://segmentfault.com/u/chokcoco",
-    "votes": "12",
-    "rank": 7
+    "votes": "13",
+    "rank": 8
   },
   {
     "title": "社区维基：将你的问答捐赠给社区",
@@ -69,16 +78,16 @@
     "author": "fenbox",
     "home_url": "https://segmentfault.com/u/fenbox",
     "votes": "12",
-    "rank": 8
+    "rank": 9
   },
   {
-    "title": "妙用 CSS 构建花式透视背景效果",
-    "description": "本文将介绍一种巧用 background 配合 backdrop- filter 来构建有趣的透视背景效果的方式。本技巧源自于一名群友的提问，如何构建如 ElementUI 文档的一种顶栏背景特效，看看效果：仔细看，在页面的的滚动过程中，...",
-    "url": "https://segmentfault.com/a/1190000042267425",
+    "title": "前端构建效率优化之路",
+    "description": "我们的系统（一个 ToB 的 Web 单页应用）前端单页应用经过多年的迭代，目前已经累积有大几十万行的业务代码，30+ 路由模块，整体的代码量和复杂度还是比较高的。",
+    "url": "https://segmentfault.com/a/1190000042256837",
     "author": "chokcoco",
     "home_url": "https://segmentfault.com/u/chokcoco",
-    "votes": "15",
-    "rank": 9
+    "votes": "16",
+    "rank": 10
   },
   {
     "title": "今҈天҈真҈是҈热҈化҈了҈！",
@@ -87,15 +96,6 @@
     "author": "XboxYan",
     "home_url": "https://segmentfault.com/u/xboxyan",
     "votes": "16",
-    "rank": 10
-  },
-  {
-    "title": "防御式CSS是什么？这几点属性重点防御！",
-    "description": "微信搜索 【大迁世界】, 我会第一时间和你分享前端行业趋势，学习途径等等。本文 GitHub [链接] 已收录，有一线大厂面试完整考点、资料以及我的系列文章。",
-    "url": "https://segmentfault.com/a/1190000042272755",
-    "author": "前端小智",
-    "home_url": "https://segmentfault.com/u/minnanitkong",
-    "votes": "14",
     "rank": 11
   },
   {
@@ -104,7 +104,7 @@
     "url": "https://segmentfault.com/a/1190000042194285",
     "author": "pingan8787",
     "home_url": "https://segmentfault.com/u/pingan8787",
-    "votes": "11",
+    "votes": "12",
     "rank": 12
   },
   {
@@ -113,44 +113,17 @@
     "url": "https://segmentfault.com/a/1190000042195199",
     "author": "deepfunc",
     "home_url": "https://segmentfault.com/u/deepfunc",
-    "votes": "15",
+    "votes": "16",
     "rank": 13
   },
-  {
-    "title": "webpack 拆包：关于 splitChunks 的几个重点属性解析",
-    "description": "先来举个简单的栗子，wepack 设置中有 3 个入口文件：a.js、b.js 和 c.js，每个入口文件都同步 import 了 m1.js，不设置 splitChunks，配置下 webpack-bundle-analyzer 插件用来查看输出文件的内容，打包输出是这...",
-    "url": "https://segmentfault.com/a/1190000042093955",
-    "author": "deepfunc",
-    "home_url": "https://segmentfault.com/u/deepfunc",
-    "votes": "7",
-    "rank": 14
-  },
-  {
-    "title": "前端构建效率优化之路",
-    "description": "我们的系统（一个 ToB 的 Web 单页应用）前端单页应用经过多年的迭代，目前已经累积有大几十万行的业务代码，30+ 路由模块，整体的代码量和复杂度还是比较高的。",
-    "url": "https://segmentfault.com/a/1190000042256837",
-    "author": "chokcoco",
-    "home_url": "https://segmentfault.com/u/chokcoco",
-    "votes": "12",
-    "rank": 15
-  },
-  {
-    "title": "面试官：主说 Git Rebase 和 Git Merge 差异",
-    "description": "有梦想，有干货，微信搜索 【大迁世界】 关注这个在凌晨还在刷碗的刷碗智。本文 GitHub [链接] 已收录，有一线大厂面试完整考点、资料以及我的系列文章。",
-    "url": "https://segmentfault.com/a/1190000042092852",
-    "author": "前端小智",
-    "home_url": "https://segmentfault.com/u/minnanitkong",
-    "votes": "11",
-    "rank": 16
-  },
   {
     "title": "【分享】从Mybatis源码中，学习到的10种设计模式",
     "description": "你说的没错，但你天天写CRUD，你觉得 烦不？ 慌不？ 是不是既担心自己没有得到技术成长，也害怕将来没法用这些都是CRUD的项目去参加；述职、晋升、答辩，甚至可能要被迫面试时，自己手里一点干货也没有的情况。",
     "url": "https://segmentfault.com/a/1190000042183733",
     "author": "小傅哥",
     "home_url": "https://segmentfault.com/u/fuzhengwei",
-    "votes": "11",
-    "rank": 17
+    "votes": "12",
+    "rank": 14
   },
   {
     "title": "一个简洁、强大、可扩展的前端项目架构是什么样的？",
@@ -158,8 +131,8 @@
     "url": "https://segmentfault.com/a/1190000042200631",
     "author": "卡颂",
     "home_url": "https://segmentfault.com/u/kasong",
-    "votes": "11",
-    "rank": 18
+    "votes": "12",
+    "rank": 15
   },
   {
     "title": "如何提出一个高质量的问题？",
@@ -168,7 +141,7 @@
     "author": "唯一丶",
     "home_url": "https://segmentfault.com/u/weiyi_5b04fb4aa815a",
     "votes": "11",
-    "rank": 19
+    "rank": 16
   },
   {
     "title": "Wuzzle，不 eject 也能定制 create-react-app 创建的 React 应用",
@@ -177,7 +150,7 @@
     "author": "乌柏木",
     "home_url": "https://segmentfault.com/u/wubomu",
     "votes": "14",
-    "rank": 20
+    "rank": 17
   },
   {
     "title": "使用前端技术实现静态图片局部流动效果 🌊",
@@ -186,7 +159,7 @@
     "author": "dragonir",
     "home_url": "https://segmentfault.com/u/dragonir",
     "votes": "9",
-    "rank": 21
+    "rank": 18
   },
   {
     "title": "搭建前端监控，采集用户行为的 N 种姿势",
@@ -195,7 +168,16 @@
     "author": "杨成功",
     "home_url": "https://segmentfault.com/u/ruidoc",
     "votes": "11",
-    "rank": 22
+    "rank": 19
+  },
+  {
+    "title": "可视化拖拽组件库一些技术要点原理分析（四）",
+    "description": "本文是可视化拖拽系列的第四篇，比起之前的三篇文章，这篇功能点要稍微少一点，总共有五点：SVG 组件动态属性面板数据来源（接口请求）组件联动组件按需加载如果你对我之前的系列文章不是很了解，建议先把这三篇...",
+    "url": "https://segmentfault.com/a/1190000042282658",
+    "author": "谭光志",
+    "home_url": "https://segmentfault.com/u/woai3c",
+    "votes": "10",
+    "rank": 20
   },
   {
     "title": "梳理 Webpack 知识体系与学习资源推荐",
@@ -204,16 +186,25 @@
     "author": "JackySummer",
     "home_url": "https://segmentfault.com/u/jackysummer",
     "votes": "14",
-    "rank": 23
+    "rank": 21
   },
   {
-    "title": "Three.js系列: 在元宇宙看电影，享受 VR 视觉盛宴",
-    "description": "最近元宇宙的概念很火，并且受到疫情的影响，我们的出行总是受限，电影院也总是关门，但是在家里又没有看大片的氛围，这个时候我们就可以通过自己来造一个宇宙，并在 VR 设备（Oculus 、cardboard）中来观看。",
-    "url": "https://segmentfault.com/a/1190000042094334",
-    "author": "程序员秋风",
-    "home_url": "https://segmentfault.com/u/qiufeng_5a07f6cb96ee0",
-    "votes": "6",
-    "rank": 24
+    "title": "详聊immer.js高效复制与冻结\"对象\"的原理于局限性",
+    "description": "immer.js应该是2019年时候火起来的一个库, 他可以高效的复制一个对象(比如相对于JSON.parse(JSON.stringify(obj))), 并且冻结对这个对象上的一些值的修改权限。",
+    "url": "https://segmentfault.com/a/1190000042282263",
+    "author": "lulu_up",
+    "home_url": "https://segmentfault.com/u/lulu_up",
+    "votes": "8",
+    "rank": 22
+  },
+  {
+    "title": "通向架子工的前端开发利器推荐",
+    "description": "01：thunderclient: VSCode 中的 postmanVSCode 的一个插件，在 VSCode 中管理请求资源，如同 postman 一样。它支持与 postman 兼容的格式，可导出为 postman Collection。02：Apifox, 团队 API 管理利器Apifox，...",
+    "url": "https://segmentfault.com/a/1190000042204295",
+    "author": "shanyue",
+    "home_url": "https://segmentfault.com/u/xiange",
+    "votes": "9",
+    "rank": 23
   },
   {
     "title": "使用Three.js实现炫酷的赛博朋克风格3D数字地球大屏 🌐",
@@ -222,7 +213,7 @@
     "author": "dragonir",
     "home_url": "https://segmentfault.com/u/dragonir",
     "votes": "6",
-    "rank": 25
+    "rank": 24
   },
   {
     "title": "Redis 内存优化神技，小内存保存大数据",
@@ -231,7 +222,7 @@
     "author": "码哥字节",
     "home_url": "https://segmentfault.com/u/magebyte",
     "votes": "10",
-    "rank": 26
+    "rank": 25
   },
   {
     "title": "我有 7种 实现web实时消息推送的方案，7种！",
@@ -240,7 +231,7 @@
     "author": "程序员小富",
     "home_url": "https://segmentfault.com/u/chengxy",
     "votes": "14",
-    "rank": 27
+    "rank": 26
   },
   {
     "title": "你的 Tap bar  不够花里胡哨，试试这个！",
@@ -249,6 +240,15 @@
     "author": "前端小智",
     "home_url": "https://segmentfault.com/u/minnanitkong",
     "votes": "8",
+    "rank": 27
+  },
+  {
+    "title": "Shopee在React Native 架构方面的探索",
+    "description": "React Native（下文简称 RN）是混合应用领域流行的跨端开发框架。RN 非常适合灵活多变的电商领域业务，由于 RN 是基于客户端渲染的技术，所以相较于 H5 页面，它在用户体验方面有一定优势。",
+    "url": "https://segmentfault.com/a/1190000042183220",
+    "author": "xiangzhihong",
+    "home_url": "https://segmentfault.com/u/xiangzhihong",
+    "votes": "6",
     "rank": 28
   },
   {
@@ -257,7 +257,7 @@
     "url": "https://segmentfault.com/a/1190000042229850",
     "author": "云叔_又拍云",
     "home_url": "https://segmentfault.com/u/yunshu_blog",
-    "votes": "10",
+    "votes": "11",
     "rank": 29
   },
   {