@wcj/github-rank 22.8.2 → 22.8.5

package/web/data/sifou-daily.json

@@ -1,92 +1,47 @@
 [
   {
-    "title": "提升web输入体验！JS 如何自动配对标点符号？",
-    "description": "欢迎关注微信公众号前端侦探温馨提示：在阅读本文之前，可以先回顾这篇文章：Web 中的“选区”和“光标”，有很多你可能不太知道的原生 API，以下内容是对该内容的实践运用在写作编辑中，有很多需要成对出现的标点符...",
-    "url": "https://segmentfault.com/a/1190000042251637",
-    "author": "XboxYan",
-    "home_url": "https://segmentfault.com/u/xboxyan",
-    "votes": "10",
+    "title": "妙用 CSS 构建花式透视背景效果",
+    "description": "本文将介绍一种巧用 background 配合 backdrop- filter 来构建有趣的透视背景效果的方式。本技巧源自于一名群友的提问，如何构建如 ElementUI 文档的一种顶栏背景特效，看看效果：仔细看，在页面的的滚动过程中，...",
+    "url": "https://segmentfault.com/a/1190000042267425",
+    "author": "chokcoco",
+    "home_url": "https://segmentfault.com/u/chokcoco",
+    "votes": "7",
     "rank": 1
   },
   {
-    "title": "M1 nvm install报错",
-    "description": "M1执行nvm install安装node报错404 {代码...} 经过分析发现命令安装node版本时，M1电脑自动拼接路径如下：[链接]arm64是M1特有的软件命令方式 目前node官网不提供此类的压缩包 压缩包官网 解决方案执行install命...",
-    "url": "https://segmentfault.com/a/1190000042254696",
-    "author": "浅夏晴空",
-    "home_url": "https://segmentfault.com/u/qianxiaqingkong",
-    "votes": "2",
+    "title": "OpenInfra Days China 2022 启幕在即，SegmentFault 思否战略支持",
+    "description": "OpenInfra Days China 是由 OpenInfra 基金会（前身 OpenStack 基金会）授权，由全球各个地区的社区志愿者团队共同筹划组织的一次年度的开源基础设施技术与行业盛会。自 2016 年中国社区的志愿者们第一次筹办面向...",
+    "url": "https://segmentfault.com/a/1190000042267659",
+    "author": "MissD",
+    "home_url": "https://segmentfault.com/u/d2ms1shh",
+    "votes": "3",
     "rank": 2
   },
   {
-    "title": "WebGPU 导入[1] - 入门常见问题与个人分享",
-    "description": "什么是应用级？这两个库都屏蔽了 WebGL 的底层调用细节，大多数时候，你编写的代码更专注于“场景”中的“三维物体”的位置，加载“模型文件”，高级点的会写漂亮的“材质”。这些带引号的概念，在 WebGL 底层接口都是没...",
-    "url": "https://segmentfault.com/a/1190000042255266",
-    "author": "四季留歌",
-    "home_url": "https://segmentfault.com/u/onsummer",
+    "title": "基于 Next.js实现在线Excel",
+    "description": "如果要从头开始使用 React 构建一个完整的 Web 应用程序，需要哪些步骤？这当然不像把大象装进冰箱那么简单，只需要分成三步：打开冰箱，拿起大象，塞进冰箱就好。",
+    "url": "https://segmentfault.com/a/1190000042268783",
+    "author": "葡萄城技术团队",
+    "home_url": "https://segmentfault.com/u/grapecity",
     "votes": "1",
     "rank": 3
   },
   {
-    "title": "AI目标分割能力，无需绿幕即可实现快速视频抠图",
-    "description": "绿幕抠图是影视制作过程中常见的技术手段，常用于视频中抠除并替换背景，通过后期加工实现视频剪辑制作的更多可能性。然而，绿幕抠图技术制作成本费时费力，无法应用于日常生活。",
-    "url": "https://segmentfault.com/a/1190000042252173",
-    "author": "HMSCore",
-    "home_url": "https://segmentfault.com/u/hms_core",
+    "title": "分享几个公用的高清壁纸图片的API",
+    "description": "我们可以根据它来获取这张图片的指定分辨率以及指定画质的图片，以上图为例，如果我们要获取分辨率为 1024*768 ，画质为 80 (最高为100)的图片，只需将上述链接的 “bdr/__85” 替换为 “bdm/1024_768_80” 即可。替...",
+    "url": "https://segmentfault.com/a/1190000042270044",
+    "author": "遗失的美好灬",
+    "home_url": "https://segmentfault.com/u/yishidemeihao_5b9ce075877c9",
     "votes": "1",
     "rank": 4
   },
   {
-    "title": "独立产品灵感周刊 DecoHack #024 - 90年代的网站设计",
-    "description": "本周刊记录有趣好玩的独立产品设计开发相关内容，每周发布，感兴趣的伙伴可以点击订阅我的周刊。为保证每期都能收到，建议邮件订阅。欢迎通过 Twitter 私信推荐或投稿。",
-    "url": "https://segmentfault.com/a/1190000042252026",
-    "author": "ViggoZ",
-    "home_url": "https://segmentfault.com/u/viggoz",
+    "title": "互动接收端 UI 组件如何兼容 Vue2 和 Vue3",
+    "description": "保利威云直播产品可以在直播过程发起签到、抽奖、问卷等互动。对应地，在观看端也需要呈现这些互动。为了让保利威云直播观看页以及客户定制观看页都能方便地接入这些功能，我们把互动功能做成了一个 SDK，即互动...",
+    "url": "https://segmentfault.com/a/1190000042266889",
+    "author": "ws",
+    "home_url": "https://segmentfault.com/u/ws_62ea1cfe73328",
     "votes": "1",
     "rank": 5
-  },
-  {
-    "title": "MarkDown公式指导手册",
-    "description": "原文链接 一、公式使用参考1．如何插入公式$\\TeX$ 可使用行中公式放在文中与其它文字混编，或单独成行的独立公式。（1）行中公式可以用如下方法表示： {代码...} 例子： {代码...} 显示： $ J_\\alpha(x) = \\...",
-    "url": "https://segmentfault.com/a/1190000042253190",
-    "author": "代码的路",
-    "home_url": "https://segmentfault.com/u/zbzcdzf",
-    "votes": "1",
-    "rank": 6
-  },
-  {
-    "title": "[信息安全] WEP 是什么",
-    "description": "WEP(Wired Equivalent Privacy) 有线等效保密 是一种保护无线传输安全性的协议。起源于 1997 年的 IEEE 802.11，是第一个 WiFi 安全标准。",
-    "url": "https://segmentfault.com/a/1190000042255754",
-    "author": "Ljzn",
-    "home_url": "https://segmentfault.com/u/exunit",
-    "votes": "1",
-    "rank": 7
-  },
-  {
-    "title": "组件关系问题",
-    "description": "新增和列表组件关系之前的项目的设计中，列表组件和新增组件是兄弟组件。 {代码...} 开始时，位于列表组件index。点击新增，跳到add路由，此时加载add组件，并且index组件销毁。新增完成后，需要回跳到index组件...",
-    "url": "https://segmentfault.com/a/1190000042254847",
-    "author": "weiewiyi",
-    "home_url": "https://segmentfault.com/u/chenchu_6110ed583800c",
-    "votes": "1",
-    "rank": 8
-  },
-  {
-    "title": "记录最近遇到的问题",
-    "description": "按照常理来说一般出现 no provide for NgForm报错都是因为没有引入ReactiveFormsModule，但是经过检查也已经引入了相应的模块。下面是出现报错的代码，去除后没有问题。",
-    "url": "https://segmentfault.com/a/1190000042253360",
-    "author": "李明",
-    "home_url": "https://segmentfault.com/u/crister_612f55567eb8c",
-    "votes": "1",
-    "rank": 9
-  },
-  {
-    "title": "数据结构与算法-跳表",
-    "description": "跳表可以达到和红黑树一样的时间复杂度O(logN)，且实现简单，Redis中的有序集合对象的底层数据结构就使用了跳表。本篇文章将对跳表的实现进行学习。",
-    "url": "https://segmentfault.com/a/1190000042251862",
-    "author": "半夏之沫",
-    "home_url": "https://segmentfault.com/u/banxiazhimo",
-    "votes": "1",
-    "rank": 10
   }
 ]

package/web/data/sifou-monthly.json

@@ -18,22 +18,40 @@
     "rank": 2
   },
   {
-    "title": "CSS层级小技巧！如何在滚动时自动添加头部阴影？",
-    "description": "在网页中，经常会用阴影来突出层级关系，特别是顶部导航，但有时候设计觉得没必要一开始就显示阴影，只有滚动后才出现。比如下面这个例子，注意观察头部阴影",
-    "url": "https://segmentfault.com/a/1190000042065365",
+    "title": "超酷炫的转场动画？CSS 轻松拿下！",
+    "description": "在 WeGame 的 PC 端官网首页，有着非常多制作精良的基于滚动的动画效果。这里我简单截取其中 2 个比较有意思的转场动画，大家感受感受。转场动画 1：转场动画 2：是不是挺有意思的，整个动画的衔接是基于滚轮的滚...",
+    "url": "https://segmentfault.com/a/1190000042184211",
+    "author": "chokcoco",
+    "home_url": "https://segmentfault.com/u/chokcoco",
+    "votes": "19",
+    "rank": 3
+  },
+  {
+    "title": "动画合成小技巧！CSS 实现动感的倒计时效果",
+    "description": "欢迎关注微信公众号： 前端侦探介绍一个 CSS 动画合成小技巧。先看效果这是一个非常“动感”的倒计时效果，通常在一些活动开场中比较常见，分析一下整个动画过程，不难发现，有以下几类动画数字的变化缩小和放大透...",
+    "url": "https://segmentfault.com/a/1190000042094549",
     "author": "XboxYan",
     "home_url": "https://segmentfault.com/u/xboxyan",
     "votes": "21",
-    "rank": 3
+    "rank": 4
   },
   {
-    "title": "叮~您有一封Vue.js挑战邀请函,请查收",
-    "description": "大家好,我是webfansplz.今天要跟大家分享的是vuejs-challenges,一个Vue.js在线挑战平台,它提供了一些题库,开发者可以在线进行挑战.通过这些挑战,我们可以进一步了解和熟悉Vue.js,希望它能对想学习Vue.js的同学有...",
-    "url": "https://segmentfault.com/a/1190000042064246",
-    "author": "null仔",
-    "home_url": "https://segmentfault.com/u/xiaoqianduan_58b28cfebff36",
-    "votes": "14",
-    "rank": 4
+    "title": "高阶切图技巧！基于单张图片的任意颜色转换",
+    "description": "今天，要介绍一种基于 CSS mask-composite 的高级技巧。通过掌握它，我们可以通过一张 图片，得到关于它的各种变换，甚至乎，得到各种不同颜色的变换。通过单张 PNG/SVG 得到它的反向切图事情的经过是这样的，某...",
+    "url": "https://segmentfault.com/a/1190000042093361",
+    "author": "chokcoco",
+    "home_url": "https://segmentfault.com/u/chokcoco",
+    "votes": "13",
+    "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",
+    "rank": 6
   },
   {
     "title": "利用噪声构建美妙的 CSS 图形",
@@ -42,7 +60,7 @@
     "author": "chokcoco",
     "home_url": "https://segmentfault.com/u/chokcoco",
     "votes": "12",
-    "rank": 5
+    "rank": 7
   },
   {
     "title": "使用CSS background实现炫酷悬停效果",
@@ -51,42 +69,24 @@
     "author": "南城大前端",
     "home_url": "https://segmentfault.com/u/nanchengfe",
     "votes": "14",
-    "rank": 6
+    "rank": 8
   },
   {
-    "title": "动画合成小技巧！CSS 实现动感的倒计时效果",
-    "description": "欢迎关注微信公众号： 前端侦探介绍一个 CSS 动画合成小技巧。先看效果这是一个非常“动感”的倒计时效果，通常在一些活动开场中比较常见，分析一下整个动画过程，不难发现，有以下几类动画数字的变化缩小和放大透...",
-    "url": "https://segmentfault.com/a/1190000042094549",
+    "title": "提升web输入体验！JS 如何自动配对标点符号？",
+    "description": "欢迎关注微信公众号前端侦探温馨提示：在阅读本文之前，可以先回顾这篇文章：Web 中的“选区”和“光标”，有很多你可能不太知道的原生 API，以下内容是对该内容的实践运用在写作编辑中，有很多需要成对出现的标点符...",
+    "url": "https://segmentfault.com/a/1190000042251637",
     "author": "XboxYan",
     "home_url": "https://segmentfault.com/u/xboxyan",
-    "votes": "19",
-    "rank": 7
-  },
-  {
-    "title": "超酷炫的转场动画？CSS 轻松拿下！",
-    "description": "在 WeGame 的 PC 端官网首页，有着非常多制作精良的基于滚动的动画效果。这里我简单截取其中 2 个比较有意思的转场动画，大家感受感受。转场动画 1：转场动画 2：是不是挺有意思的，整个动画的衔接是基于滚轮的滚...",
-    "url": "https://segmentfault.com/a/1190000042184211",
-    "author": "chokcoco",
-    "home_url": "https://segmentfault.com/u/chokcoco",
-    "votes": "17",
-    "rank": 8
-  },
-  {
-    "title": "高阶切图技巧！基于单张图片的任意颜色转换",
-    "description": "今天，要介绍一种基于 CSS mask-composite 的高级技巧。通过掌握它，我们可以通过一张 图片，得到关于它的各种变换，甚至乎，得到各种不同颜色的变换。通过单张 PNG/SVG 得到它的反向切图事情的经过是这样的，某...",
-    "url": "https://segmentfault.com/a/1190000042093361",
-    "author": "chokcoco",
-    "home_url": "https://segmentfault.com/u/chokcoco",
-    "votes": "12",
+    "votes": "13",
     "rank": 9
   },
   {
-    "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": "16",
+    "title": "社区维基：将你的问答捐赠给社区",
+    "description": "小王初学编程的时候，在 SegmentFault 提出了许多相关的问题。在社区热心人的帮助下，小王的问题一个个得到了解决，编程技术进步神速。",
+    "url": "https://segmentfault.com/a/1190000042203704",
+    "author": "fenbox",
+    "home_url": "https://segmentfault.com/u/fenbox",
+    "votes": "12",
     "rank": 10
   },
   {
@@ -95,16 +95,16 @@
     "url": "https://segmentfault.com/a/1190000042217446",
     "author": "XboxYan",
     "home_url": "https://segmentfault.com/u/xboxyan",
-    "votes": "13",
+    "votes": "14",
     "rank": 11
   },
   {
-    "title": "社区维基：将你的问答捐赠给社区",
-    "description": "小王初学编程的时候，在 SegmentFault 提出了许多相关的问题。在社区热心人的帮助下，小王的问题一个个得到了解决，编程技术进步神速。",
-    "url": "https://segmentfault.com/a/1190000042203704",
-    "author": "fenbox",
-    "home_url": "https://segmentfault.com/u/fenbox",
-    "votes": "10",
+    "title": "试着换个角度理解低代码平台设计的本质",
+    "description": "本文会主要分享自己对低代码平台的理解，从多个角度和问题去看低代码平台的设计。我觉得低代码平台的核心在于模型设计，包括控件模型、组件模型、画布模型等等。希望看完本文，你能知道：",
+    "url": "https://segmentfault.com/a/1190000042194285",
+    "author": "pingan8787",
+    "home_url": "https://segmentfault.com/u/pingan8787",
+    "votes": "11",
     "rank": 12
   },
   {
@@ -117,14 +117,32 @@
     "rank": 13
   },
   {
-    "title": "试着换个角度理解低代码平台设计的本质",
-    "description": "本文会主要分享自己对低代码平台的理解，从多个角度和问题去看低代码平台的设计。我觉得低代码平台的核心在于模型设计，包括控件模型、组件模型、画布模型等等。希望看完本文，你能知道：",
-    "url": "https://segmentfault.com/a/1190000042194285",
-    "author": "pingan8787",
-    "home_url": "https://segmentfault.com/u/pingan8787",
-    "votes": "10",
+    "title": "一步步带你搞懂虚拟 DOM 的工作原理",
+    "description": "React 和 Vue 中都有虚拟 DOM 的概念，我们应该如何理解和掌握虚拟 DOM 的精髓呢？我推荐大家学习 Snabbdom 这个项目。Snabbdom 是一个虚拟 DOM 实现库，推荐的原因一是代码比较少，核心代码只有几百行；二是 Vue...",
+    "url": "https://segmentfault.com/a/1190000042195199",
+    "author": "deepfunc",
+    "home_url": "https://segmentfault.com/u/deepfunc",
+    "votes": "15",
     "rank": 14
   },
+  {
+    "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": 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": "一个简洁、强大、可扩展的前端项目架构是什么样的？",
     "description": "大家好，我卡颂。React技术栈的一大优势在于 —— 社区繁荣，你业务中需要实现的功能基本都能找到对应的开源库。但繁荣也有不好的一面 —— 要实现同样的功能，有太多选择，到底选哪个？本文要介绍一个12.7k的开源项...",
@@ -132,7 +150,7 @@
     "author": "卡颂",
     "home_url": "https://segmentfault.com/u/kasong",
     "votes": "11",
-    "rank": 15
+    "rank": 17
   },
   {
     "title": "如何提出一个高质量的问题？",
@@ -141,24 +159,6 @@
     "author": "唯一丶",
     "home_url": "https://segmentfault.com/u/weiyi_5b04fb4aa815a",
     "votes": "11",
-    "rank": 16
-  },
-  {
-    "title": "一步步带你搞懂虚拟 DOM 的工作原理",
-    "description": "React 和 Vue 中都有虚拟 DOM 的概念，我们应该如何理解和掌握虚拟 DOM 的精髓呢？我推荐大家学习 Snabbdom 这个项目。Snabbdom 是一个虚拟 DOM 实现库，推荐的原因一是代码比较少，核心代码只有几百行；二是 Vue...",
-    "url": "https://segmentfault.com/a/1190000042195199",
-    "author": "deepfunc",
-    "home_url": "https://segmentfault.com/u/deepfunc",
-    "votes": "13",
-    "rank": 17
-  },
-  {
-    "title": "搭建前端监控，采集用户行为的 N 种姿势",
-    "description": "上一篇我们详细介绍了前端如何采集异常数据。采集异常数据是为了随时监测线上项目的运行情况，发现问题及时修复。在很多场景下，除了异常监控有用，收集用户的行为数据同样有意义。",
-    "url": "https://segmentfault.com/a/1190000042194426",
-    "author": "杨成功",
-    "home_url": "https://segmentfault.com/u/ruidoc",
-    "votes": "10",
     "rank": 18
   },
   {
@@ -171,12 +171,12 @@
     "rank": 19
   },
   {
-    "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": "6",
+    "title": "搭建前端监控，采集用户行为的 N 种姿势",
+    "description": "上一篇我们详细介绍了前端如何采集异常数据。采集异常数据是为了随时监测线上项目的运行情况，发现问题及时修复。在很多场景下，除了异常监控有用，收集用户的行为数据同样有意义。",
+    "url": "https://segmentfault.com/a/1190000042194426",
+    "author": "杨成功",
+    "home_url": "https://segmentfault.com/u/ruidoc",
+    "votes": "11",
     "rank": 20
   },
   {
@@ -194,18 +194,27 @@
     "url": "https://segmentfault.com/a/1190000042094334",
     "author": "程序员秋风",
     "home_url": "https://segmentfault.com/u/qiufeng_5a07f6cb96ee0",
-    "votes": "5",
+    "votes": "6",
     "rank": 22
   },
   {
-    "title": "面试官：主说 Git Rebase 和 Git Merge 差异",
-    "description": "有梦想，有干货，微信搜索 【大迁世界】 关注这个在凌晨还在刷碗的刷碗智。本文 GitHub [链接] 已收录，有一线大厂面试完整考点、资料以及我的系列文章。",
-    "url": "https://segmentfault.com/a/1190000042092852",
-    "author": "前端小智",
-    "home_url": "https://segmentfault.com/u/minnanitkong",
-    "votes": "9",
+    "title": "使用Three.js实现炫酷的赛博朋克风格3D数字地球大屏 🌐",
+    "description": "近期工作有涉及到数字大屏的需求，于是利用业余时间，结合 Three.js 和 CSS实现赛博朋克2077风格视觉效果 实现炫酷 3D 数字地球大屏页面。页面使用 React + Three.js + Echarts + stylus 技术栈，本文涉及到的主...",
+    "url": "https://segmentfault.com/a/1190000042216817",
+    "author": "dragonir",
+    "home_url": "https://segmentfault.com/u/dragonir",
+    "votes": "6",
     "rank": 23
   },
+  {
+    "title": "梳理 Webpack 知识体系与学习资源推荐",
+    "description": "前言关于 Webpack 之前已经有写过几篇零散的文章:由零开始使用 Webpack 来搭建 React 项目Webpack Sourcemap 回顾升级 Webpack5 实践如何编写一个 Webpack Loader如何编写一个 Webpack Plugin而本文的内容则不会...",
+    "url": "https://segmentfault.com/a/1190000042232699",
+    "author": "JackySummer",
+    "home_url": "https://segmentfault.com/u/jackysummer",
+    "votes": "13",
+    "rank": 24
+  },
   {
     "title": "🗂 看了 web.dev 的 631 篇博客，我总结了这些内容",
     "description": "最近在做 web 性能优化的工作，所以想集中学习了解一下相关的专题内容。这部分内容肯定要学习一手信息，所以找先找了 [链接]，一个 Google 官方推出的一个面向 Web 开发者的网站，里面有非常多的教程和最佳实践，...",
@@ -213,7 +222,7 @@
     "author": "卤代烃",
     "home_url": "https://segmentfault.com/u/skychx",
     "votes": "8",
-    "rank": 24
+    "rank": 25
   },
   {
     "title": "Nginx 实战核心知识点整理（上）",
@@ -222,16 +231,25 @@
     "author": "Rhythm_2019",
     "home_url": "https://segmentfault.com/u/rhythm_2019",
     "votes": "8",
-    "rank": 25
+    "rank": 26
   },
   {
-    "title": "梳理 Webpack 知识体系与学习资源推荐",
-    "description": "前言关于 Webpack 之前已经有写过几篇零散的文章:由零开始使用 Webpack 来搭建 React 项目Webpack Sourcemap 回顾升级 Webpack5 实践如何编写一个 Webpack Loader如何编写一个 Webpack Plugin而本文的内容则不会...",
-    "url": "https://segmentfault.com/a/1190000042232699",
-    "author": "JackySummer",
-    "home_url": "https://segmentfault.com/u/jackysummer",
-    "votes": "13",
-    "rank": 26
+    "title": "低代码是开发的未来吗？浅谈低代码平台",
+    "description": "低代码的热潮在几年前就火过，从阿里钉钉跨平台协作方式，再到飞书上的审批流程，以及目前我们接触到的表单审批、投票的模板，这些都是关于低代码的实现方式。随着企业数字化转型和云计算的不断发展，低代码平台...",
+    "url": "https://segmentfault.com/a/1190000042229850",
+    "author": "云叔_又拍云",
+    "home_url": "https://segmentfault.com/u/yunshu_blog",
+    "votes": "9",
+    "rank": 27
+  },
+  {
+    "title": "前端构建效率优化之路",
+    "description": "我们的系统（一个 ToB 的 Web 单页应用）前端单页应用经过多年的迭代，目前已经累积有大几十万行的业务代码，30+ 路由模块，整体的代码量和复杂度还是比较高的。",
+    "url": "https://segmentfault.com/a/1190000042256837",
+    "author": "chokcoco",
+    "home_url": "https://segmentfault.com/u/chokcoco",
+    "votes": "8",
+    "rank": 28
   },
   {
     "title": "通向架子工的前端开发利器推荐",
@@ -240,33 +258,15 @@
     "author": "shanyue",
     "home_url": "https://segmentfault.com/u/xiange",
     "votes": "8",
-    "rank": 27
-  },
-  {
-    "title": "Nginx部署配置",
-    "description": "常用命令启动： {代码...} 立即停止： {代码...} 优雅停止： {代码...} 重启 {代码...} 查看配置文件是否正常，无语法错误 {代码...} 查看日志 {代码...} upstream基本语法upstream 的基本语法如下，一个 upstrea...",
-    "url": "https://segmentfault.com/a/1190000042089218",
-    "author": "MangoGoing",
-    "home_url": "https://segmentfault.com/u/nulidexiaocongmang",
-    "votes": "5",
-    "rank": 28
-  },
-  {
-    "title": "从原生 JavaScript 到 React",
-    "description": "React 是一个用于构建用户界面的 JavaScript 框架。它可用于通过动态操作页面内容来创建 JavaScript 应用程序。浏览器已经提供了在页面中创建元素的 API，即 DOM，所以新手可能想知道 React 带来了什么以及它与 D...",
-    "url": "https://segmentfault.com/a/1190000042196411",
-    "author": "Yujiaao",
-    "home_url": "https://segmentfault.com/u/yujiaao",
-    "votes": "7",
     "rank": 29
   },
   {
-    "title": "使用Three.js实现炫酷的赛博朋克风格3D数字地球大屏 🌐",
-    "description": "近期工作有涉及到数字大屏的需求，于是利用业余时间，结合 Three.js 和 CSS实现赛博朋克2077风格视觉效果 实现炫酷 3D 数字地球大屏页面。页面使用 React + Three.js + Echarts + stylus 技术栈，本文涉及到的主...",
-    "url": "https://segmentfault.com/a/1190000042216817",
-    "author": "dragonir",
-    "home_url": "https://segmentfault.com/u/dragonir",
-    "votes": "5",
+    "title": "我有 7种 实现web实时消息推送的方案，7种！",
+    "description": "技术交流，公众号：程序员小富大家好，我是小富～我有一个朋友～做了一个小破站，现在要实现一个站内信web消息推送的功能，对，就是下图这个小红点，一个很常用的功能。不过他还没想好用什么方式做，这里我帮他整...",
+    "url": "https://segmentfault.com/a/1190000042192378",
+    "author": "程序员小富",
+    "home_url": "https://segmentfault.com/u/chengxy",
+    "votes": "13",
     "rank": 30
   }
 ]