@wcj/github-rank 22.7.16 → 22.7.19

package/dist/sifou-daily.json

@@ -1,209 +1,110 @@
 [
   {
-    "title": "无需CORS，用nginx解决跨域问题，轻松实现低代码开发的前后端分离",
-    "description": "在技术层面，前后端分离指在同一个Web系统中，前端服务器和后端服务器采用不同的技术栈，利用标准的WebAPI完成协同工作。这种前后端分离的\"混合开发\"模式下，前后端通常会部署到不同的服务器上，即便部...",
-    "url": "https://segmentfault.com/a/1190000042115197",
-    "author": "葡萄城技术团队",
-    "home_url": "https://segmentfault.com/u/grapecity",
-    "votes": "1",
+    "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": "8",
     "rank": 1
   },
   {
-    "title": "主流移动端组件库的对比和分析",
-    "description": "随着前端的发展，组件库也是层出不穷，一个完善的组件库能极大提高开发效率，让开发者只需要专注于业务逻辑，而不需要考虑基础组件复用性、扩展性、稳定性的问题。面对众多的组件库，该如何进行选择呢？本篇将从...",
-    "url": "https://segmentfault.com/a/1190000042112945",
-    "author": "京东设计中心JDC",
-    "home_url": "https://segmentfault.com/u/jingdongshejizhongxin",
-    "votes": "2",
+    "title": "超酷炫的转场动画？CSS 轻松拿下！",
+    "description": "在 WeGame 的 PC 端官网首页，有着非常多制作精良的基于滚动的动画效果。这里我简单截取其中 2 个比较有意思的转场动画，大家感受感受。转场动画 1：转场动画 2：是不是挺有意思的，整个动画的衔接是基于滚轮的滚...",
+    "url": "https://segmentfault.com/a/1190000042184211",
+    "author": "chokcoco",
+    "home_url": "https://segmentfault.com/u/chokcoco",
+    "votes": "5",
     "rank": 2
   },
   {
-    "title": "冴羽答读者问：如何学习更有计划性、提升更稳更快？",
-    "description": "算是一个前端的时间也有五年了，今年也刚好满 30 岁了，感觉自己一直忙着完成业务，为了保持竞争力、不落伍等原因而学习新的框架、工具；回想起来年少轻狂浪费了不少时间，有了老婆孩子之后学习的时间也越来越少...",
-    "url": "https://segmentfault.com/a/1190000042178486",
-    "author": "冴羽",
-    "home_url": "https://segmentfault.com/u/yayu",
-    "votes": "4",
+    "title": "「原理篇」你真的了解 React18 的并发吗？",
+    "description": "前阵子，打磨已久的React18终于正式发布，其中最重要的一个更新就是并发（concurrency）。其他的新特性如Suspense、useTransition、useDeferredValue 的内部原理都是基于并发的，可想而知在这次更新中并发的重要性。",
+    "url": "https://segmentfault.com/a/1190000042186883",
+    "author": "起风了",
+    "home_url": "https://segmentfault.com/u/qifengliao_5e7f5b20ee3bd",
+    "votes": "1",
     "rank": 3
   },
   {
-    "title": "vscode 解析——如何维护海量模块依赖关系(二)",
-    "description": "前言上次我们解释了 vscode 这种大型项目设计依赖注入管理海量的模块有什么好处。也提到了 DI 必须有这样一种机制：1、模块与模块之间的无源码依赖（这里的模块主要指类）2、只依赖接口/抽象，不依赖具体实现3、...",
-    "url": "https://segmentfault.com/a/1190000042178445",
-    "author": "混沌福王",
-    "home_url": "https://segmentfault.com/u/flywang",
+    "title": "Golang RPC （一）Go标准库的简单实现 介绍+使用",
+    "description": "在涉及RPC的应用中，作为开发人员一般至少有三种角色：首先是服务端实现RPC方法的开发人员，其次是客户端调用RPC方法的人员，最后也是最重要的是制定服务端和客户端RPC接口规范的设计人员。在前面的例子中我们为...",
+    "url": "https://segmentfault.com/a/1190000042184813",
+    "author": "LiberHome",
+    "home_url": "https://segmentfault.com/u/liberhome",
     "votes": "1",
     "rank": 4
   },
   {
-    "title": "web-compiler：mvvm 的实现思路",
-    "description": "然后想了一下Svelte 组件 大体思路定义一套dsl,然后通过Svelte编译成js css 代码，html对应的dom通过js生成。顺着这个思路写了一个最小化的 mvvm 的示例",
-    "url": "https://segmentfault.com/a/1190000042114347",
-    "author": "yangrd",
-    "home_url": "https://segmentfault.com/u/yangrd",
+    "title": "工程效能CI/CD之流水线引擎的建设实践",
+    "description": "经过近3年的建设打磨，美团流水线引擎完成了服务端的基建统一，每日支撑近十万次的流水线执行量，系统成功率保持在99.99%以上。本文主要介绍在自研引擎建设层面遇到的挑战以及解决方案。",
+    "url": "https://segmentfault.com/a/1190000042184293",
+    "author": "美团技术团队",
+    "home_url": "https://segmentfault.com/u/meituanjishutuandui",
     "votes": "1",
     "rank": 5
   },
   {
-    "title": "【直播回顾】OpenHarmony知识赋能六期第三课—OpenHarmony智能家居项目之控制面板功能实现",
-    "description": "7月14日晚上19点，知识赋能第六期第三节直播 《OpenHarmony智能家居项目之控制面板功能实现》 ，在OpenHarmony开发者成长计划社群内成功举行。本次直播是“OpenHarmony开源开发者成长计划项目”举办的知识赋能系列...",
-    "url": "https://segmentfault.com/a/1190000042114132",
-    "author": "OpenHarmony社区",
-    "home_url": "https://segmentfault.com/u/openharmony",
+    "title": "如何在spring boot 使用 gitlab的Api",
+    "description": "首先我们需要获取gitlab的Admin access token, 并且在请求的时候附带这个token,gitlab才能认证我们的身份并返回数据。",
+    "url": "https://segmentfault.com/a/1190000042187142",
+    "author": "weiewiyi",
+    "home_url": "https://segmentfault.com/u/chenchu_6110ed583800c",
     "votes": "2",
     "rank": 6
   },
   {
-    "title": "基于eTS高效开发HarmonyOS课程类应用",
-    "description": "随着HarmonyOS 3.0 Beta版的发布，API Version 8新增了大批JS/eTS API接口，相信很多开发者已经迫不及待想体验基于eTS的HamronyOS应用开发。本期Codelab，我们将基于API Version 8实现一个HarmonyOS课程类应用，...",
-    "url": "https://segmentfault.com/a/1190000042114056",
-    "author": "HarmonyOS开发者",
-    "home_url": "https://segmentfault.com/u/harmonyos",
-    "votes": "2",
+    "title": "了解双亲委派模型",
+    "description": "当我们运行java程序时，首先需要将 .java文件经过编译后生成对应 .class文件，然后由 JVM 来加载.class文件到内存中。作为开发人员我们不需要去关心.class文件是如何被加载到 JVM中的，这一切工作都有类加载器去...",
+    "url": "https://segmentfault.com/a/1190000042187030",
+    "author": "小强Zzz",
+    "home_url": "https://segmentfault.com/u/zhaokaiqiang",
+    "votes": "1",
     "rank": 7
   },
   {
-    "title": "许式伟：Go+ 演进之路",
-    "description": "7 月 10 日，一年一度的 ECUG Con 2022 在线上圆满举行。许式伟作为七牛云 CEO、ECUG 社区发起人、Go+ 语言发明人，为大家来带了《Go+ 演进之路》的主题演讲。以下内容根据演讲实录整理。 大家好，欢迎来到 ECUG ...",
-    "url": "https://segmentfault.com/a/1190000042113338",
-    "author": "七牛云",
-    "home_url": "https://segmentfault.com/u/portal_qiniu_com",
+    "title": "千万不要把Request传递到异步线程里面！有坑！",
+    "description": "你好哇，我是歪歪。前几天在网上冲浪的时候看到一篇技术文章，讲的是他把一个 request 请求传递到了线程池里面，然后遇到了一个匪夷所思的情况。他写了这篇文章，把自己针对这个问题的探索过程分享了出来：《spri...",
+    "url": "https://segmentfault.com/a/1190000042184829",
+    "author": "why技术",
+    "home_url": "https://segmentfault.com/u/whyjishu",
     "votes": "1",
     "rank": 8
   },
   {
-    "title": "go-zero微服务实战系列（十一、大结局）",
-    "description": "本篇是整个系列的最后一篇了，本来打算在系列的最后一两篇写一下关于k8s部署相关的内容，在构思的过程中觉得自己对k8s知识的掌握还很不足，在自己没有理解掌握的前提下我觉得也很难写出自己满意的文章，大家看了...",
-    "url": "https://segmentfault.com/a/1190000042112503",
-    "author": "kevinwan",
-    "home_url": "https://segmentfault.com/u/kevinwan",
+    "title": "PWA 图标显示大小问题，兼顾 macOS、Windows",
+    "description": "会发现第三个：YouTube Music（PWA版本）的图标很不对劲，不是因为它是圆形，其他都是方形。而是它很大，宽高明显大过其他图标。在我对比了VSC和YouTube Music的图标图片之后发现了区别所在：",
+    "url": "https://segmentfault.com/a/1190000042184157",
+    "author": "林水溶",
+    "home_url": "https://segmentfault.com/u/shuirong1997",
     "votes": "1",
     "rank": 9
   },
   {
-    "title": "JavaScript一键复制内容（document.execCommand原生JS设置剪贴板）",
-    "description": "有时候为了方便用户快速复制页面的内容，一般的做法就是添加一个按钮给用户点击一下就复制下来了，这边使用JavaScript原生的方法进行设置剪贴板。",
-    "url": "https://segmentfault.com/a/1190000042178536",
-    "author": "TANKING",
-    "home_url": "https://segmentfault.com/u/tanking",
+    "title": "Go语言ORM框架：快捷查询函数的使用",
+    "description": "大多数情况下您都是在使用worm支提供的Model方式（持结构体字段映射）来访问数据库，但有些时候使用Model方式显然有些笨重。例如您可能只需要查询一个记录的一个字段的值，这种情况下若使用Model方式则比较繁琐。...",
+    "url": "https://segmentfault.com/a/1190000042186323",
+    "author": "haming",
+    "home_url": "https://segmentfault.com/u/haming123",
     "votes": "1",
     "rank": 10
   },
   {
-    "title": "vue3 解决 ESLint 各类型错误",
-    "description": "前期项目中忽略了 eslint 检查，导致一运行 npm run lint 出现两千多条错误(இдஇ; ) 造孽啊花了两三天搞完，做个错误汇总。",
-    "url": "https://segmentfault.com/a/1190000042177952",
-    "author": "Shyla",
-    "home_url": "https://segmentfault.com/u/xiaoniezi",
+    "title": "即刻报名｜飞桨黑客马拉松第三期盛夏登场，等你挑战",
+    "description": "火热是盛夏时节的主旋律，炙热的盛夏迎来了同样炙热的黑客松——飞桨黑客马拉松 PaddlePadddle Hackathon 第三期热浪来袭，邀你来战！一场面向全球开发者的深度学习领域编程活动，让你近距离感受开源、开放的魅力，...",
+    "url": "https://segmentfault.com/a/1190000042185745",
+    "author": "MissD",
+    "home_url": "https://segmentfault.com/u/d2ms1shh",
     "votes": "1",
     "rank": 11
   },
   {
-    "title": "创建Root权限虚拟环境",
-    "description": "原文链接Linux下创建Anaconda创建虚拟环境： {代码...} Linux下激活环境： {代码...} myroot为用户名，可以自己定义回到原来的环境： {代码...} 删除虚拟环境： {代码...} Windows下创建Anaconda创建虚拟环境： {...",
-    "url": "https://segmentfault.com/a/1190000042178120",
-    "author": "代码的路",
-    "home_url": "https://segmentfault.com/u/zbzcdzf",
+    "title": "可能改变前端工程化未来的特性：ESM Loader Hooks",
+    "description": "大家好，我卡颂。在最近发布的Node v18.6.0中，带来了一个试验特性ESM Loader Hooks API。如果他最终落地，很可能会成为改变前端工程化未来的特性。本文我们来聊聊他。欢迎加入人类高质量前端框架群，带飞本文参...",
+    "url": "https://segmentfault.com/a/1190000042184347",
+    "author": "卡颂",
+    "home_url": "https://segmentfault.com/u/kasong",
     "votes": "1",
     "rank": 12
-  },
-  {
-    "title": "RPN：Region Proposal Networks (区域候选网络)",
-    "description": "anchor是固定尺寸的bbox。具体做法是：把feature map每个点映射回原图的感受野的中心点当成一个基准点，然后围绕这个基准点选取k个不同的尺寸和比例的anchor。对于W×H大小的卷积feature map（通常为2400），总共...",
-    "url": "https://segmentfault.com/a/1190000042178098",
-    "author": "代码的路",
-    "home_url": "https://segmentfault.com/u/zbzcdzf",
-    "votes": "1",
-    "rank": 13
-  },
-  {
-    "title": "Python将图片输出为二维数组并保存到txt中",
-    "description": "原文链接使用Python将图片输出为二维数组，并保存到txt文件中。代码如下： {代码...} 学习更多编程知识，请关注我的公众号：代码的路",
-    "url": "https://segmentfault.com/a/1190000042177883",
-    "author": "代码的路",
-    "home_url": "https://segmentfault.com/u/zbzcdzf",
-    "votes": "1",
-    "rank": 14
-  },
-  {
-    "title": "Python将二维数组输出为图片",
-    "description": "原文链接使用Python读取二维数组，将二维数组输出为图片，并保存在本地。代码如下： {代码...} 学习更多编程知识，请关注我的公众号：代码的路",
-    "url": "https://segmentfault.com/a/1190000042177878",
-    "author": "代码的路",
-    "home_url": "https://segmentfault.com/u/zbzcdzf",
-    "votes": "1",
-    "rank": 15
-  },
-  {
-    "title": "Python对txt进行读写操作",
-    "description": "原文链接全文件读写读操作使用pandas.read_csv，写操作使用data.to_csv。 {代码...} 指定行列读写 {代码...} 学习更多编程知识，请关注我的公众号：代码的路",
-    "url": "https://segmentfault.com/a/1190000042177871",
-    "author": "代码的路",
-    "home_url": "https://segmentfault.com/u/zbzcdzf",
-    "votes": "1",
-    "rank": 16
-  },
-  {
-    "title": "pip安装更换镜像",
-    "description": "原文链接使用pip来安装python包有时候安装起来会非常慢，因此需要换成国内的源来加速下载：使用命令以Torch为例： {代码...} 常用的国内源清华大学：Simple Index中国科学技术大学：Simple Index阿里云：Simple I...",
-    "url": "https://segmentfault.com/a/1190000042177852",
-    "author": "代码的路",
-    "home_url": "https://segmentfault.com/u/zbzcdzf",
-    "votes": "1",
-    "rank": 17
-  },
-  {
-    "title": "pip安装'torch'出现PackageNotFoundError报错解决办法",
-    "description": "原文链接虚拟环境安装若安装失败，可能权限不够，需要在根用户下安装。进入根用户方法：[链接]安装torch {代码...} 或者使用： {代码...} 报错PackageNotFound错误信息：Fetching package metadata ...........Pa...",
-    "url": "https://segmentfault.com/a/1190000042177840",
-    "author": "代码的路",
-    "home_url": "https://segmentfault.com/u/zbzcdzf",
-    "votes": "1",
-    "rank": 18
-  },
-  {
-    "title": "Linux修改文件权限",
-    "description": "原文链接权限介绍我们首先使用ls -l指令查看文件的权限信息（以/etc/fstab为例）： {代码...} 可以看到输出包含：rwx rw- r--权限表示共有9位，每3位为一组，分别表示拥有者、所属组的成员和其他成员。其中，r表...",
-    "url": "https://segmentfault.com/a/1190000042177794",
-    "author": "代码的路",
-    "home_url": "https://segmentfault.com/u/zbzcdzf",
-    "votes": "1",
-    "rank": 19
-  },
-  {
-    "title": "麒麟操作系统 (kylinos) 从入门到精通 - 系统设置- 第二十六篇 PKS下动态壁纸设置",
-    "description": "类别：笔记本型号：中国长城 NF14C硬件平台：飞腾处理器（ArmV8 指令集）系统：银河麒麟操作系统 V10 SP1(2203) 关键词：信创,麒麟系统,linux,PKS,银河麒麟,飞腾,arm64,arm,动态壁纸",
-    "url": "https://segmentfault.com/a/1190000042177538",
-    "author": "码上世界",
-    "home_url": "https://segmentfault.com/u/code4world",
-    "votes": "1",
-    "rank": 20
-  },
-  {
-    "title": "C++ 构建并复制二叉树",
-    "description": "原文链接使用C++构建一个二叉树并复制、输出。程序 {代码...} 结果学习更多编程知识，请关注我的公众号：代码的路",
-    "url": "https://segmentfault.com/a/1190000042166065",
-    "author": "代码的路",
-    "home_url": "https://segmentfault.com/u/zbzcdzf",
-    "votes": "1",
-    "rank": 21
-  },
-  {
-    "title": "堆叠降噪自动编码器 Stacked Denoising Auto Encoder（SDAE）",
-    "description": "自编码器（autoencoder）是神经网络的一种，经过训练后能尝试将输入复制到输出。自编码器内部有一个隐藏层 h，可以产生编码（code）表示输入。该网络可以看作由两部分组成：一个由函数 h = f(x) 表示的编码器和一...",
-    "url": "https://segmentfault.com/a/1190000042112792",
-    "author": "代码的路",
-    "home_url": "https://segmentfault.com/u/zbzcdzf",
-    "votes": "1",
-    "rank": 22
-  },
-  {
-    "title": "如何设置导出excel的格式",
-    "description": "皕杰报表工具中有专门的配置文件来设置导出格式，在WEB-INF/resources文件夹下，有一个report-config.xml文件。用文本编辑软件打开report-config.xml文件，里面可以找到导出配置节点。",
-    "url": "https://segmentfault.com/a/1190000042112603",
-    "author": "博爱",
-    "home_url": "https://segmentfault.com/u/boai",
-    "votes": "1",
-    "rank": 23
   }
 ]

package/dist/sifou-monthly.json

@@ -5,7 +5,7 @@
     "url": "https://segmentfault.com/a/1190000042006775",
     "author": "XboxYan",
     "home_url": "https://segmentfault.com/u/xboxyan",
-    "votes": "33",
+    "votes": "34",
     "rank": 1
   },
   {
@@ -17,15 +17,6 @@
     "votes": "25",
     "rank": 2
   },
-  {
-    "title": "掘地三尺搞定 Redis 与 MySQL 数据一致性问题",
-    "description": "Redis 拥有高性能的数据读写功能，被我们广泛用在缓存场景，一是能提高业务系统的性能，二是为数据库抵挡了高并发的流量请求，点我 -> 解密 Redis 为什么这么快的秘密。把 Redis 作为缓存组件，需要防止出现以...",
-    "url": "https://segmentfault.com/a/1190000041998615",
-    "author": "码哥字节",
-    "home_url": "https://segmentfault.com/u/magebyte",
-    "votes": "22",
-    "rank": 3
-  },
   {
     "title": "CSS层级小技巧！如何在滚动时自动添加头部阴影？",
     "description": "在网页中，经常会用阴影来突出层级关系，特别是顶部导航，但有时候设计觉得没必要一开始就显示阴影，只有滚动后才出现。比如下面这个例子，注意观察头部阴影",
@@ -33,7 +24,7 @@
     "author": "XboxYan",
     "home_url": "https://segmentfault.com/u/xboxyan",
     "votes": "20",
-    "rank": 4
+    "rank": 3
   },
   {
     "title": "如何移除你项目中99%的JS代码",
@@ -42,7 +33,7 @@
     "author": "卡颂",
     "home_url": "https://segmentfault.com/u/kasong",
     "votes": "18",
-    "rank": 5
+    "rank": 4
   },
   {
     "title": "switch 有四样写法你知道么",
@@ -51,7 +42,7 @@
     "author": "边城",
     "home_url": "https://segmentfault.com/u/jamesfancy",
     "votes": "16",
-    "rank": 6
+    "rank": 5
   },
   {
     "title": "有意思的鼠标指针交互探究",
@@ -60,7 +51,7 @@
     "author": "chokcoco",
     "home_url": "https://segmentfault.com/u/chokcoco",
     "votes": "17",
-    "rank": 7
+    "rank": 6
   },
   {
     "title": "叮~您有一封Vue.js挑战邀请函,请查收",
@@ -69,7 +60,7 @@
     "author": "null仔",
     "home_url": "https://segmentfault.com/u/xiaoqianduan_58b28cfebff36",
     "votes": "13",
-    "rank": 8
+    "rank": 7
   },
   {
     "title": "视觉还原小技巧！CSS 实现角标效果",
@@ -78,6 +69,15 @@
     "author": "XboxYan",
     "home_url": "https://segmentfault.com/u/xboxyan",
     "votes": "17",
+    "rank": 8
+  },
+  {
+    "title": "使用CSS background实现炫酷悬停效果",
+    "description": "日常开发过程中，会遇到不少按钮鼠标悬停的效果，实现这类悬停效果的方式有很多，借助伪元素，CSS3变换及过渡等都可以实现。今天的文章将使用背景色实现类似的效果，当我们遇到一个问题时，你的脑海中的方案不止...",
+    "url": "https://segmentfault.com/a/1190000042069856",
+    "author": "南城大前端",
+    "home_url": "https://segmentfault.com/u/nanchengfe",
+    "votes": "13",
     "rank": 9
   },
   {
@@ -89,32 +89,14 @@
     "votes": "12",
     "rank": 10
   },
-  {
-    "title": "使用CSS background实现炫酷悬停效果",
-    "description": "日常开发过程中，会遇到不少按钮鼠标悬停的效果，实现这类悬停效果的方式有很多，借助伪元素，CSS3变换及过渡等都可以实现。今天的文章将使用背景色实现类似的效果，当我们遇到一个问题时，你的脑海中的方案不止...",
-    "url": "https://segmentfault.com/a/1190000042069856",
-    "author": "南城大前端",
-    "home_url": "https://segmentfault.com/u/nanchengfe",
-    "votes": "12",
-    "rank": 11
-  },
   {
     "title": "动画合成小技巧！CSS 实现动感的倒计时效果",
     "description": "欢迎关注微信公众号： 前端侦探介绍一个 CSS 动画合成小技巧。先看效果这是一个非常“动感”的倒计时效果，通常在一些活动开场中比较常见，分析一下整个动画过程，不难发现，有以下几类动画数字的变化缩小和放大透...",
     "url": "https://segmentfault.com/a/1190000042094549",
     "author": "XboxYan",
     "home_url": "https://segmentfault.com/u/xboxyan",
-    "votes": "14",
-    "rank": 12
-  },
-  {
-    "title": "React Suspense 尝鲜,处理前后端IO异步操作",
-    "description": "Suspense主要用来解决网络IO问题，它早在2018年的React 16.6.0版本中就已发布。它的相关用法有些已经比较成熟，有的相对不太稳定，甚至经历了重命名、删除：",
-    "url": "https://segmentfault.com/a/1190000041992773",
-    "author": "葡萄城技术团队",
-    "home_url": "https://segmentfault.com/u/grapecity",
-    "votes": "7",
-    "rank": 13
+    "votes": "15",
+    "rank": 11
   },
   {
     "title": "亚马逊云科技：“云+数+AI”助力企业数智化转型",
@@ -123,7 +105,7 @@
     "author": "思否编辑部",
     "home_url": "https://segmentfault.com/u/writers",
     "votes": "11",
-    "rank": 14
+    "rank": 12
   },
   {
     "title": "SegmentFault 思否技术周刊 -- 超实用 Vue 合集，请查收",
@@ -131,8 +113,17 @@
     "url": "https://segmentfault.com/a/1190000042048392",
     "author": "Beverly",
     "home_url": "https://segmentfault.com/u/beverly0",
+    "votes": "10",
+    "rank": 13
+  },
+  {
+    "title": "利用噪声构建美妙的 CSS 图形",
+    "description": "在平时，我非常喜欢利用 CSS 去构建一些有意思的图形。我们首先来看一个简单的例子。首先，假设我们实现一个 10x10 的格子：此时，我们可以利用一些随机效果，优化这个图案。譬如，我们给它随机添加不同的颜色：...",
+    "url": "https://segmentfault.com/a/1190000042103702",
+    "author": "chokcoco",
+    "home_url": "https://segmentfault.com/u/chokcoco",
     "votes": "9",
-    "rank": 15
+    "rank": 14
   },
   {
     "title": "PHP后端面试85问",
@@ -141,25 +132,16 @@
     "author": "IT小马",
     "home_url": "https://segmentfault.com/u/itxiaoma",
     "votes": "9",
-    "rank": 16
-  },
-  {
-    "title": "前端性能监测，Runtime Performance Debug 技巧",
-    "description": "提到 Web 前端的效能优化，有许多的技巧是聚焦在如何减少页面的“载入时间 Loading Time”，例如 Code Splitting 透过减少需要载入的 Bundle Size 来加快载入效能。也有些技巧是针对执行时期 (Runtime) 的优化与调...",
-    "url": "https://segmentfault.com/a/1190000041990709",
-    "author": "前端小智",
-    "home_url": "https://segmentfault.com/u/minnanitkong",
-    "votes": "11",
-    "rank": 17
+    "rank": 15
   },
   {
-    "title": "利用噪声构建美妙的 CSS 图形",
-    "description": "在平时，我非常喜欢利用 CSS 去构建一些有意思的图形。我们首先来看一个简单的例子。首先，假设我们实现一个 10x10 的格子：此时，我们可以利用一些随机效果，优化这个图案。譬如，我们给它随机添加不同的颜色：...",
-    "url": "https://segmentfault.com/a/1190000042103702",
-    "author": "chokcoco",
-    "home_url": "https://segmentfault.com/u/chokcoco",
-    "votes": "8",
-    "rank": 18
+    "title": "熬夜爆肝整理的一份elasticsearch中文文档手册",
+    "description": "Elaticsearch，简称为 ES， ES 是一个开源的高扩展的分布式全文搜索引擎，Elasticsearch 是面向文档型数据库，一条数据在这里就是一个文档。",
+    "url": "https://segmentfault.com/a/1190000042059652",
+    "author": "7small7",
+    "home_url": "https://segmentfault.com/u/7small7",
+    "votes": "10",
+    "rank": 16
   },
   {
     "title": "SegmentFault 思否社区 10 周年 | 寄语有奖获奖名单公布，快来领奖~",
@@ -168,16 +150,7 @@
     "author": "SegmentFault思否",
     "home_url": "https://segmentfault.com/u/segmentfault",
     "votes": "7",
-    "rank": 19
-  },
-  {
-    "title": "熬夜爆肝整理的一份elasticsearch中文文档手册",
-    "description": "Elaticsearch，简称为 ES， ES 是一个开源的高扩展的分布式全文搜索引擎，Elasticsearch 是面向文档型数据库，一条数据在这里就是一个文档。",
-    "url": "https://segmentfault.com/a/1190000042059652",
-    "author": "7small7",
-    "home_url": "https://segmentfault.com/u/7small7",
-    "votes": "9",
-    "rank": 20
+    "rank": 17
   },
   {
     "title": "Sass应用之实现主题切换",
@@ -186,7 +159,7 @@
     "author": "玛尔斯通",
     "home_url": "https://segmentfault.com/u/zhouqichao",
     "votes": "7",
-    "rank": 21
+    "rank": 18
   },
   {
     "title": "玩转 AbortController 控制器",
@@ -195,7 +168,7 @@
     "author": "jump__jump",
     "home_url": "https://segmentfault.com/u/jump_and_jump",
     "votes": "6",
-    "rank": 22
+    "rank": 19
   },
   {
     "title": "esbuild 构建油猴脚本",
@@ -204,7 +177,7 @@
     "author": "边城",
     "home_url": "https://segmentfault.com/u/jamesfancy",
     "votes": "6",
-    "rank": 23
+    "rank": 20
   },
   {
     "title": "Vue项目之使用EditorConfig, Eslint和Prettier实现代码规范",
@@ -213,7 +186,7 @@
     "author": "玛尔斯通",
     "home_url": "https://segmentfault.com/u/zhouqichao",
     "votes": "11",
-    "rank": 24
+    "rank": 21
   },
   {
     "title": "又拍云 Redis 的改进之路",
@@ -222,7 +195,16 @@
     "author": "云叔_又拍云",
     "home_url": "https://segmentfault.com/u/yunshu_blog",
     "votes": "7",
-    "rank": 25
+    "rank": 22
+  },
+  {
+    "title": "Three.js系列: 在元宇宙看电影，享受 VR 视觉盛宴",
+    "description": "最近元宇宙的概念很火，并且受到疫情的影响，我们的出行总是受限，电影院也总是关门，但是在家里又没有看大片的氛围，这个时候我们就可以通过自己来造一个宇宙，并在 VR 设备（Oculus 、cardboard）中来观看。",
+    "url": "https://segmentfault.com/a/1190000042094334",
+    "author": "程序员秋风",
+    "home_url": "https://segmentfault.com/u/qiufeng_5a07f6cb96ee0",
+    "votes": "5",
+    "rank": 23
   },
   {
     "title": "几百行代码实现一个 JSON 解析器",
@@ -231,7 +213,7 @@
     "author": "crossoverJie",
     "home_url": "https://segmentfault.com/u/crossoverjie",
     "votes": "5",
-    "rank": 26
+    "rank": 24
   },
   {
     "title": "🗂 看了 web.dev 的 631 篇博客，我总结了这些内容",
@@ -240,16 +222,16 @@
     "author": "卤代烃",
     "home_url": "https://segmentfault.com/u/skychx",
     "votes": "7",
-    "rank": 27
+    "rank": 25
   },
   {
-    "title": "Three.js系列: 在元宇宙看电影，享受 VR 视觉盛宴",
-    "description": "最近元宇宙的概念很火，并且受到疫情的影响，我们的出行总是受限，电影院也总是关门，但是在家里又没有看大片的氛围，这个时候我们就可以通过自己来造一个宇宙，并在 VR 设备（Oculus 、cardboard）中来观看。",
-    "url": "https://segmentfault.com/a/1190000042094334",
-    "author": "程序员秋风",
-    "home_url": "https://segmentfault.com/u/qiufeng_5a07f6cb96ee0",
+    "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": "5",
-    "rank": 28
+    "rank": 26
   },
   {
     "title": "热乎乎的前端\"数字\" 转换 \"货币字符串\", 如此有趣的知识来啦 (Intl.NumberFormat)",
@@ -257,16 +239,34 @@
     "url": "https://segmentfault.com/a/1190000042037852",
     "author": "lulu_up",
     "home_url": "https://segmentfault.com/u/lulu_up",
-    "votes": "11",
+    "votes": "12",
+    "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": "SegmentFault 思否社区 10 周年 | 问答打卡获奖名单公布，快来领奖~",
+    "description": "【问答有奖】的中奖小伙伴们，我们会在7月1日以后奖礼品陆续发出PS：疫情地区若无法接收快递，发货时间会适当延后~哈喽，各位社区的小伙伴！SegmentFault 思否社区 10 周年社区活动开奖啦，快来领奖~以下揭晓的是...",
+    "url": "https://segmentfault.com/a/1190000042020576",
+    "author": "SegmentFault思否",
+    "home_url": "https://segmentfault.com/u/segmentfault",
+    "votes": "5",
     "rank": 29
   },
   {
-    "title": "React新文档：不要滥用Ref哦～",
-    "description": "React新文档有个很有意思的细节：useRef、useEffect这两个API的介绍，在文档中所在的章节叫Escape Hatches（逃生舱）。",
-    "url": "https://segmentfault.com/a/1190000041991074",
-    "author": "卡颂",
-    "home_url": "https://segmentfault.com/u/kasong",
-    "votes": "9",
+    "title": "CentOS中实现基于Docker部署BI数据分析",
+    "description": "但是我还想要完成领导下达的任务：在linux中安装docker后部署数据可视化工具。作为一名敬业 的打工人摆烂不可以，躺平不可以，弱小，无助，可怜中。。这能力，这要去，要不直接散伙算了。但是，没想到，我们还是...",
+    "url": "https://segmentfault.com/a/1190000042030725",
+    "author": "葡萄城技术团队",
+    "home_url": "https://segmentfault.com/u/grapecity",
+    "votes": "4",
     "rank": 30
   }
 ]