@wcj/github-rank 22.5.7 → 22.5.10

package/dist/sifou-daily.json

@@ -1,83 +1,146 @@
 [
   {
-    "title": "React官方团队出手，补齐原生Hook短板",
-    "description": "大家好，我卡颂。我们知道，Hooks使用时存在所谓的闭包陷阱，考虑如下代码： {代码...} 我们期望点击后sendMessage能传递text的最新值。然而实际上，由于回调函数被useCallback缓存，形成闭包，所以点击的效果始...",
-    "url": "https://segmentfault.com/a/1190000041798153",
-    "author": "卡颂",
-    "home_url": "https://segmentfault.com/u/kasong",
-    "votes": "4",
+    "title": "CSS 实现树状结构目录",
+    "description": "如果用到了 Ant Design 这样的框架，那可以直接用现成的组件。如果没有用到这样的框架呢？其实纯 CSS 也是可以搞定的，下面看看如何实现的，还有很多你可能不知道 CSS 小技巧哦~",
+    "url": "https://segmentfault.com/a/1190000041815758",
+    "author": "XboxYan",
+    "home_url": "https://segmentfault.com/u/xboxyan",
+    "votes": "3",
     "rank": 1
   },
   {
-    "title": "【面试普通人VS高手系列】讲一下wait和notify这个为什么要在synchronized代码块中？",
-    "description": "一个工作七年的小伙伴，竟然不知道”wait”和“notify”为什么要在Synchronized代码块里面。好吧，如果屏幕前的你也不知道，请在评论区打上”不知道“。对于这个问题，我们来看看普通人和高手的回答。",
-    "url": "https://segmentfault.com/a/1190000041800866",
-    "author": "跟着Mic学架构",
-    "home_url": "https://segmentfault.com/u/fukua_5be8034f8191f",
-    "votes": "1",
+    "title": "初级程序员的SQL拾遗-②（表操作）",
+    "description": "前言虽然平时开发中经常接触MySQL，但大多数的数据库操作都是通过ORM映射实现的，自己并没有从底层接触SQL。本文继 初级程序员的SQL拾遗-①（增删改查） 主要内容包括：建库、建表、字段、约束、查询等实际开发过...",
+    "url": "https://segmentfault.com/a/1190000041818633",
+    "author": "LYX6666",
+    "home_url": "https://segmentfault.com/u/liuyuxuan6666",
+    "votes": "4",
     "rank": 2
   },
   {
-    "title": "🔥 基于 Vite构建react开源中后台项目，支持Mock 数据、国际化、暗夜模式切换",
-    "description": "Arco-admin-template是一个免费开源的中后台模板你，使用了React17、vite2、react-router-dom v6、less 等主流技术开发，开箱即用的中后台前端解决方案。",
-    "url": "https://segmentfault.com/a/1190000041798934",
-    "author": "husanil",
-    "home_url": "https://segmentfault.com/u/fushengruomengweihuanjihe",
-    "votes": "1",
+    "title": "改@用户功能为动态",
+    "description": "查到可以添加几个事件，上述代码为限制input输入内容为数字。onkeyup事件每当输入就会执行，我们设置一个方法，替换非数字为空。里面检测非数字用到了正则表达式。",
+    "url": "https://segmentfault.com/a/1190000041818549",
+    "author": "小强Zzz",
+    "home_url": "https://segmentfault.com/u/zhaokaiqiang",
+    "votes": "4",
     "rank": 3
   },
   {
-    "title": "PingCode Flow技术架构揭秘",
-    "description": "作者：PingCode 研发 VP@徐子岩本文是PingCode Flow系列文章的第四篇，不出意外的话，也是最后一篇。从去年五月份PingCode Flow正式上线，就在脑海中构思好了四篇文档的顺序和大致内容，从介绍研发自动化的现状...",
-    "url": "https://segmentfault.com/a/1190000041801014",
-    "author": "PingCode研发中心",
-    "home_url": "https://segmentfault.com/u/pingcodeyanfazhongxin",
-    "votes": "1",
+    "title": "ActivatedRoute 和 Router，以及记录后台遇到的问题",
+    "description": "ActivatedRoute 和 Router的区别前台angular使用这两个来进行路由的操作，但是好像一直不大清楚区别。这里简单记录一下。区别 {代码...} ActivatedRoute是当前组件的路由对象，包含了当前的路由信息。router是全...",
+    "url": "https://segmentfault.com/a/1190000041818528",
+    "author": "weiewiyi",
+    "home_url": "https://segmentfault.com/u/chenchu_6110ed583800c",
+    "votes": "4",
     "rank": 4
   },
   {
-    "title": "Logseq 获 410万美元融资！加速开源神经元知识管理系统增长，构建新世界双链知识图谱",
-    "description": "5 月 5 日，Logseq 官方博客发文正式宣布了“Logseq 获得 410 万美元首轮融资”的消息 —— We're proud to announce our first $4.1M seed round ，引发业内关注。",
-    "url": "https://segmentfault.com/a/1190000041798996",
-    "author": "MissD",
-    "home_url": "https://segmentfault.com/u/d2ms1shh",
-    "votes": "2",
+    "title": "总结一下本周遇到的问题",
+    "description": "在写区域工作人员端任务管理时需要获取登陆人员所管理的居民，这时就出现了一个问题——后台要怎么实现这些功能呢?我们可以发现前台并没有把当前登录用户传给后台，所以理论上应该是直接从后台获取当前登录用户。之...",
+    "url": "https://segmentfault.com/a/1190000041815869",
+    "author": "李明",
+    "home_url": "https://segmentfault.com/u/pluto_612f55567eb8c",
+    "votes": "4",
     "rank": 5
   },
   {
-    "title": "Visual Studio Code 发布四月更新：新增Rust 语言指南",
-    "description": "近日，Visual Studio Code 发布了四月更新（1.67 版本），此次更新亮点包括：资源管理器文件嵌套 - 在资源管理器中的源文件下嵌套生成的文件「设置」的编辑器过滤器 - 过滤器按钮会显示@Modified设置等搜索括号对...",
-    "url": "https://segmentfault.com/a/1190000041800125",
-    "author": "snakesss",
-    "home_url": "https://segmentfault.com/u/snakesss",
+    "title": "Vue注册的全局组件配置对象保存的位置",
+    "description": "有时候你想给Vue一些组件库新增一些补丁功能或者修改功能，这些库如果像ElementUI一样有暴露到全局的api，还容易运行时篡改，如果没有暴露到全局上但有注册成全局组件，但是你又不想去库的源代码，怎么办呢？其实...",
+    "url": "https://segmentfault.com/a/1190000041815526",
+    "author": "而井",
+    "home_url": "https://segmentfault.com/u/rioli",
     "votes": "1",
     "rank": 6
   },
   {
-    "title": "2022 软件开发者“时间管理”调查报告：近 90% 的人认为开源代码必不可少|68% 的人发现在办公室工作效率更高",
-    "description": "“程序员、开发者、软件工程师们他们每天到底在干什么？到底花多少时间写代码？”这个问题你是不是也有点好奇呢？近日，Retool 就对 600 名软件工程师（包括 ICs 和管理人员）做了个调查，报告结果令人吃惊。",
-    "url": "https://segmentfault.com/a/1190000041799949",
-    "author": "MissD",
-    "home_url": "https://segmentfault.com/u/d2ms1shh",
-    "votes": "1",
+    "title": "4.9W 播放量的 TS 动画版进阶教程合集来了！",
+    "description": "阿宝哥精心准备的 《轻松学 TypeScript》 视频教程来咯，强烈推荐！通过形象生动的动画，让你轻松搞懂 TypeScript 的难点和核心知识点！目前已更新到第 11 期，其中 2 期的观看量均已破 1.3W，该合集的播放量目前...",
+    "url": "https://segmentfault.com/a/1190000041819579",
+    "author": "阿宝哥",
+    "home_url": "https://segmentfault.com/u/angular4",
+    "votes": "2",
     "rank": 7
   },
   {
-    "title": "重磅更新！Mall电商实战教程全面升级，瞬间高大上了！",
-    "description": "学习过我的开源项目mall的朋友应该知道，mall项目有个学习教程网站。由于目前已有200+篇原创文章，都放在这个网站里面未免有些凌乱！最近我把网站改版成基于VuePress的文档网站了，同时将文章分成了6个成体系的实...",
-    "url": "https://segmentfault.com/a/1190000041798374",
-    "author": "macrozheng",
-    "home_url": "https://segmentfault.com/u/macrozheng",
-    "votes": "1",
+    "title": "跳动的“loading”，个个都很惊艳！",
+    "description": "大家好，我是半夏👴，一个刚刚开始写文的沙雕程序员.如果喜欢我的文章，可以关注➕ 点赞 👍 加我微信：frontendpicker，一起学习交流前端，成为更优秀的工程师～关注公众号：搞前端的半夏,了解更多前端知识! 点我探...",
+    "url": "https://segmentfault.com/a/1190000041819357",
+    "author": "搞前端的半夏",
+    "home_url": "https://segmentfault.com/u/banxia_frontend",
+    "votes": "2",
     "rank": 8
   },
   {
-    "title": "简单谈谈C语言数据类型转换的安全问题",
-    "description": "在这里，a的值应该为几，没错，已经不再是之前的数字，而是变成了b赋予的值，也就是说，我们这两行代码已经将a赋予的3变成了b赋予的0，我们将这种系统“偷偷摸摸”修改的称之为隐性转换。",
-    "url": "https://segmentfault.com/a/1190000041802865",
-    "author": "Keen",
-    "home_url": "https://segmentfault.com/u/keen_626105e1ef632",
+    "title": "分享一个我看源码时的小技巧。",
+    "description": "你好呀，我是歪歪。我在之前的文章里面不是经常叫大家拉源码，然后看代码提交记录吗。也就是看类似于这个界面：比如上面这个界面中，就可以看到 RedissonBaseLock.java 这个文件，由谁在什么时候进行过变更，以及...",
+    "url": "https://segmentfault.com/a/1190000041815888",
+    "author": "why技术",
+    "home_url": "https://segmentfault.com/u/whyjishu",
     "votes": "1",
     "rank": 9
+  },
+  {
+    "title": "用JavaScript入门函数式编程，刚入门趁热分享",
+    "description": "我们入门编程的时候，通常都是从命令式编程开始，即最简单的过程式代码。后来为了处理大型项目又接触到面向对象，也属于命令式。而函数式编程属于声明式，其实它的出现早于面向对象。",
+    "url": "https://segmentfault.com/a/1190000041819623",
+    "author": "VaporSpace",
+    "home_url": "https://segmentfault.com/u/wuyuanwuhuitianzhenwuxie",
+    "votes": "1",
+    "rank": 10
+  },
+  {
+    "title": "React常见的面试题以及答案",
+    "description": "React常见的面试题以及答案说说对React的理解？有哪些特性？区分Real DOM和Virtual DOM什么是JSX和它的特性？类组件和函数组件之间有什么区别？了解 Virtual DOM 吗？解释一下它的工作原理。说说对 State 和 Prop...",
+    "url": "https://segmentfault.com/a/1190000041816759",
+    "author": "eraser123",
+    "home_url": "https://segmentfault.com/u/eraser",
+    "votes": "1",
+    "rank": 11
+  },
+  {
+    "title": "首个彻底保证缓存与数据库一致性的开源方案",
+    "description": "大量的实际的项目中，都会引入 Redis 缓存来缓解数据库的查询压力，此时由于一个数据在 Redis 和数据库两处进行了存储，就会有数据一致性的问题。目前业界尚未见到成熟的能够确保最终一致性的方案，特别是当如下...",
+    "url": "https://segmentfault.com/a/1190000041815412",
+    "author": "叶东富",
+    "home_url": "https://segmentfault.com/u/yedongfu",
+    "votes": "1",
+    "rank": 12
+  },
+  {
+    "title": "【校招/社招】面试字节，写了一份硬核简历！",
+    "description": "傅哥我要实习了、傅哥我要校招了、傅哥我要跳槽了，但我现在还没有啥拿的出手的项目，也不会包装简历，东拼西凑的内容在招聘网站，投了几次都石沉大海没有啥下文了！！！其实就算让我去面试，自己都感觉有虚，怎...",
+    "url": "https://segmentfault.com/a/1190000041814734",
+    "author": "小傅哥",
+    "home_url": "https://segmentfault.com/u/fuzhengwei",
+    "votes": "3",
+    "rank": 13
+  },
+  {
+    "title": "【面试普通人VS高手系列】说一说Mybatis里面的缓存机制",
+    "description": "一个工作了 5年的程序员，在私信里面不断向我诉苦。他说，他用了Mybatis这么久，怎么滴也算是精通Mybatis了吧。结果竟然在Mybatis这个面试题上翻车了！ 真的好烦！好吧，我们今天来看看“Mybatis里面的缓存机制”，...",
+    "url": "https://segmentfault.com/a/1190000041817208",
+    "author": "跟着Mic学架构",
+    "home_url": "https://segmentfault.com/u/fukua_5be8034f8191f",
+    "votes": "2",
+    "rank": 14
+  },
+  {
+    "title": "为什么 Go 用起来会难受？这 6 个细节你知道吗",
+    "description": "大家好，我是煎鱼。在做新的应用选型时，我们会进行应用编程语言的选择，这时会纠结 Java、PHP、Go...各种，会思考有没有致命的问题，不能用？可以明确的是，Go 没有非常致命的问题，否则你我他都不会在这里相遇...",
+    "url": "https://segmentfault.com/a/1190000041816069",
+    "author": "煎鱼",
+    "home_url": "https://segmentfault.com/u/eddycjy",
+    "votes": "2",
+    "rank": 15
+  },
+  {
+    "title": "企业级低代码 | 灵魂拷问：低代码真的安全可靠吗？ | 飞速创软",
+    "description": "在一篇题为《低代码和无代码开发的4个安全问题》的文章中，作者 Chris Hughes 表示，“通过允许企业中更多的人开发应用程序，低代码开发会产生新的漏洞，并在安全性方面隐藏问题。”",
+    "url": "https://segmentfault.com/a/1190000041815156",
+    "author": "飞速低代码平台",
+    "home_url": "https://segmentfault.com/u/dadedanta",
+    "votes": "1",
+    "rank": 16
   }
 ]

package/dist/sifou-monthly.json

@@ -1,13 +1,4 @@
 [
-  {
-    "title": "还在使用定时器吗？CSS 也能实现电子时钟",
-    "description": "欢迎关注我的公众号：前端侦探通常要做一个时钟，肯定离不开 JS 定时器。今天换一种思路，用 CSS 来实现一个时钟，如下：你也可以访问这个CSS time (codepen.io)查看实际效果当然借用了一点点 JS 用于初始化时间...",
-    "url": "https://segmentfault.com/a/1190000041661094",
-    "author": "XboxYan",
-    "home_url": "https://segmentfault.com/u/xboxyan",
-    "votes": "47",
-    "rank": 1
-  },
   {
     "title": "分享 15 个 Vue3 全家桶开发的避坑经验",
     "description": "最近入门 Vue3 并完成 3 个项目，遇到问题蛮多的，今天就花点时间整理一下，和大家分享 15 个比较常见的问题，基本都贴出对应文档地址，还请多看文档~已经完成的 3 个项目基本都是使用 Vue3 (setup-script 模式)...",
@@ -15,8 +6,26 @@
     "author": "pingan8787",
     "home_url": "https://segmentfault.com/u/pingan8787",
     "votes": "51",
+    "rank": 1
+  },
+  {
+    "title": "SegmentFault 思否加入 ONES",
+    "description": "ONES 成立于 2015 年，是国内领先的企业级研发管理解决方案提供商。2021 年，ONES 连续完成 3 轮总计近 1 亿美元融资，是国内研发管理领域累计融资金额最多、历史融资速度最快的公司。",
+    "url": "https://segmentfault.com/a/1190000041790775",
+    "author": "SegmentFault思否",
+    "home_url": "https://segmentfault.com/u/segmentfault",
+    "votes": "38",
     "rank": 2
   },
+  {
+    "title": "10",
+    "description": "各位 SegmentFault 思否社区的小伙伴们，相信大家已经从多个渠道了解到 SegmentFault 将加入 ONES 的消息。而今年正好也是 SegmentFault 社区创立的 10 周年，有趣的是 “10” 这个数字不论在十进制还是计算机世界...",
+    "url": "https://segmentfault.com/a/1190000041790801",
+    "author": "joyqi",
+    "home_url": "https://segmentfault.com/u/joyqi",
+    "votes": "47",
+    "rank": 3
+  },
   {
     "title": "JS阻塞渲染，这么多年我理解错啦？",
     "description": "大家好，我卡颂。在中文社区，这么多年一直流传一个说法：JS线程负责执行JS，GUI渲染线程负责渲染，这两者是互斥的，所以JS执行时会阻塞渲染。但随着Dev Tools使用的增多，逐渐开始怀疑以上说法。本文会以实际案...",
@@ -24,7 +33,7 @@
     "author": "卡颂",
     "home_url": "https://segmentfault.com/u/kasong",
     "votes": "39",
-    "rank": 3
+    "rank": 4
   },
   {
     "title": "11+ chrome高级调试技巧，学会效率直接提升666%",
@@ -33,52 +42,25 @@
     "author": "前端胖头鱼",
     "home_url": "https://segmentfault.com/u/116263",
     "votes": "43",
-    "rank": 4
-  },
-  {
-    "title": "SegmentFault 思否加入 ONES",
-    "description": "ONES 成立于 2015 年，是国内领先的企业级研发管理解决方案提供商。2021 年，ONES 连续完成 3 轮总计近 1 亿美元融资，是国内研发管理领域累计融资金额最多、历史融资速度最快的公司。",
-    "url": "https://segmentfault.com/a/1190000041790775",
-    "author": "SegmentFault思否",
-    "home_url": "https://segmentfault.com/u/segmentfault",
-    "votes": "29",
     "rank": 5
   },
   {
-    "title": "巧用 background-clip 实现超强的文字动效",
-    "description": "最近，有同学询问，如何使用 CSS 实现如下效果：看起来是个很有意思的动效。仔细思考一下，要想实现这类效果，其实用到的核心属性只有一个 -- background-clip: text。有意思的 background-clip: textbackground-...",
-    "url": "https://segmentfault.com/a/1190000041666096",
-    "author": "chokcoco",
-    "home_url": "https://segmentfault.com/u/chokcoco",
-    "votes": "38",
+    "title": "10个我经常逛的“小网站”，嘿嘿嘿！！！",
+    "description": "你的文件夹里有没有一些私人喜好的小网站？嘿嘿！！！必须有啊！分享10个我经常使用、能够提高工作效率、美化图片、绘制流程图的网站，你可能也用得上喔。",
+    "url": "https://segmentfault.com/a/1190000041728567",
+    "author": "前端胖头鱼",
+    "home_url": "https://segmentfault.com/u/116263",
+    "votes": "30",
     "rank": 6
   },
-  {
-    "title": "10",
-    "description": "各位 SegmentFault 思否社区的小伙伴们，相信大家已经从多个渠道了解到 SegmentFault 将加入 ONES 的消息。而今年正好也是 SegmentFault 社区创立的 10 周年，有趣的是 “10” 这个数字不论在十进制还是计算机世界...",
-    "url": "https://segmentfault.com/a/1190000041790801",
-    "author": "joyqi",
-    "home_url": "https://segmentfault.com/u/joyqi",
-    "votes": "35",
-    "rank": 7
-  },
   {
     "title": "Amazing！巧用 CSS 视差实现酷炫交互动效",
     "description": "本文将介绍利用 CSS 实现滚动视差效果的一个小技巧，并且，利用这个技巧来制作一些有意思的交互特效。关于使用 CSS 实现滚动视差效果，在之前有一篇文章详细描述过具体方案 - CSS 实现视差效果，感兴趣的同学可以...",
     "url": "https://segmentfault.com/a/1190000041718060",
     "author": "chokcoco",
     "home_url": "https://segmentfault.com/u/chokcoco",
-    "votes": "20",
-    "rank": 8
-  },
-  {
-    "title": "10个我经常逛的“小网站”，嘿嘿嘿！！！",
-    "description": "你的文件夹里有没有一些私人喜好的小网站？嘿嘿！！！必须有啊！分享10个我经常使用、能够提高工作效率、美化图片、绘制流程图的网站，你可能也用得上喔。",
-    "url": "https://segmentfault.com/a/1190000041728567",
-    "author": "前端胖头鱼",
-    "home_url": "https://segmentfault.com/u/116263",
-    "votes": "29",
-    "rank": 9
+    "votes": "24",
+    "rank": 7
   },
   {
     "title": "小程序鼻祖 —— 在国内逐渐消亡的 PWA 可以带给我们哪些启示？",
@@ -87,16 +69,7 @@
     "author": "獨釣寒江雪",
     "home_url": "https://segmentfault.com/u/king_hcj",
     "votes": "26",
-    "rank": 10
-  },
-  {
-    "title": "Koa2 搭建信令服务器，JS 也能搞定视频通话！",
-    "description": "在实际应用场景中，信令服务器的本质就是一台 WeSocket 服务器，两个客户端必须与这个服务器建立 WeSocket 连接，才能互相发送消息。",
-    "url": "https://segmentfault.com/a/1190000041668070",
-    "author": "杨成功",
-    "home_url": "https://segmentfault.com/u/ruidoc",
-    "votes": "24",
-    "rank": 11
+    "rank": 8
   },
   {
     "title": "现代 CSS 解决方案：Modern CSS Reset",
@@ -105,7 +78,7 @@
     "author": "chokcoco",
     "home_url": "https://segmentfault.com/u/chokcoco",
     "votes": "24",
-    "rank": 12
+    "rank": 9
   },
   {
     "title": "40行代码实现React核心Diff算法",
@@ -114,7 +87,16 @@
     "author": "卡颂",
     "home_url": "https://segmentfault.com/u/kasong",
     "votes": "14",
-    "rank": 13
+    "rank": 10
+  },
+  {
+    "title": "🔥前端脚手架辣么多，那我也要写一个玩玩",
+    "description": "2022年已经过了四分之一还多了，之前说好的每个月一片文章好像也没有让自己兑现。最近公司在做一些前端工程化相关的东西，虽然准备做组件库的事情被领导给毙了，不过在这之前写了一个脚手架的工具，...",
+    "url": "https://segmentfault.com/a/1190000041693503",
+    "author": "恪晨",
+    "home_url": "https://segmentfault.com/u/bo_wang_code",
+    "votes": "18",
+    "rank": 11
   },
   {
     "title": "以B端平台设计，理解尼尔森10大可用性原则",
@@ -123,25 +105,25 @@
     "author": "JenK",
     "home_url": "https://segmentfault.com/u/wangzc996",
     "votes": "20",
-    "rank": 14
+    "rank": 12
   },
   {
-    "title": "🔥前端脚手架辣么多，那我也要写一个玩玩",
-    "description": "2022年已经过了四分之一还多了，之前说好的每个月一片文章好像也没有让自己兑现。最近公司在做一些前端工程化相关的东西，虽然准备做组件库的事情被领导给毙了，不过在这之前写了一个脚手架的工具，...",
-    "url": "https://segmentfault.com/a/1190000041693503",
-    "author": "恪晨",
-    "home_url": "https://segmentfault.com/u/bo_wang_code",
-    "votes": "17",
-    "rank": 15
+    "title": "我做了一个在线白板！！！",
+    "description": "相信各位写文章的朋友平时肯定都有画图的需求，笔者平时用的是一个在线的手绘风格白板--excalidraw，使用体验上没的说，但是有一个问题，不能云端保存，不过好消息它是开源的，所以笔者就在想要不要基于它做一个...",
+    "url": "https://segmentfault.com/a/1190000041769612",
+    "author": "街角小林",
+    "home_url": "https://segmentfault.com/u/jiejiaoxiaolin",
+    "votes": "11",
+    "rank": 13
   },
   {
-    "title": "CSS 实现切角效果",
-    "description": "欢迎关注我的公众号：前端侦探最近项目中看到这样的一个切角效果，如下所示就是一个正常的矩形，然后被“切”了一块，而且是沿着右上角切的。那么，这种布局如何实现呢？一、自适应方式这种布局一般有两种自适应方...",
-    "url": "https://segmentfault.com/a/1190000041715976",
-    "author": "XboxYan",
-    "home_url": "https://segmentfault.com/u/xboxyan",
-    "votes": "13",
-    "rank": 16
+    "title": "CSS 中的简写到底有多少坑？以后不敢了...",
+    "description": "为什么说是爱恨情仇呢？因为简写给我们带来了很多的便利，但凡事都有好有坏，你不能说简写一点坏处都没有。所以我们就聊聊简写的 \"好\" 和 \"坏\"",
+    "url": "https://segmentfault.com/a/1190000041804988",
+    "author": "零一",
+    "home_url": "https://segmentfault.com/u/zero2one",
+    "votes": "15",
+    "rank": 14
   },
   {
     "title": "2022 PHP程序员修炼秘籍",
@@ -149,26 +131,26 @@
     "url": "https://segmentfault.com/a/1190000041734354",
     "author": "CrazyCodes",
     "home_url": "https://segmentfault.com/u/crazycodes",
-    "votes": "15",
-    "rank": 17
+    "votes": "16",
+    "rank": 15
   },
   {
-    "title": "我做了一个在线白板！！！",
-    "description": "相信各位写文章的朋友平时肯定都有画图的需求，笔者平时用的是一个在线的手绘风格白板--excalidraw，使用体验上没的说，但是有一个问题，不能云端保存，不过好消息它是开源的，所以笔者就在想要不要基于它做一个...",
-    "url": "https://segmentfault.com/a/1190000041769612",
-    "author": "街角小林",
-    "home_url": "https://segmentfault.com/u/jiejiaoxiaolin",
-    "votes": "9",
-    "rank": 18
+    "title": "仅用一个HTML标签，实现带动画的抖音LOGO",
+    "description": "大家好，我是零一，今天给大家表演 仅用一个HTML标签实现带动画的抖音LOGO，涉及了很多知识点，欢迎交流讨论先上结果，最终实现效果如下：还原度应该还可以吧？抖音Logo结构想要用CSS来画抖音的Logo，前提要先了...",
+    "url": "https://segmentfault.com/a/1190000041754709",
+    "author": "零一",
+    "home_url": "https://segmentfault.com/u/zero2one",
+    "votes": "17",
+    "rank": 16
   },
   {
-    "title": "图说前端-送给您百张前端技术图谱",
-    "description": "TNTWeb - 全称腾讯新闻前端团队，组内小伙伴在 Web 前端、NodeJS 开发、UI 设计、移动 APP 等大前端领域都有所实践和积累。目前团队主要支持腾讯新闻各业务的前端开发，业务开发之余也积累沉淀了一些前端基础设施...",
-    "url": "https://segmentfault.com/a/1190000041707644",
-    "author": "TNTWEB",
-    "home_url": "https://segmentfault.com/u/tnfe",
+    "title": "CSS 实现切角效果",
+    "description": "欢迎关注我的公众号：前端侦探最近项目中看到这样的一个切角效果，如下所示就是一个正常的矩形，然后被“切”了一块，而且是沿着右上角切的。那么，这种布局如何实现呢？一、自适应方式这种布局一般有两种自适应方...",
+    "url": "https://segmentfault.com/a/1190000041715976",
+    "author": "XboxYan",
+    "home_url": "https://segmentfault.com/u/xboxyan",
     "votes": "13",
-    "rank": 19
+    "rank": 17
   },
   {
     "title": "🔥 2022 前端性能优化最佳实践",
@@ -176,8 +158,8 @@
     "url": "https://segmentfault.com/a/1190000041753539",
     "author": "佩奇烹饪家",
     "home_url": "https://segmentfault.com/u/cloudyttt",
-    "votes": "11",
-    "rank": 20
+    "votes": "12",
+    "rank": 18
   },
   {
     "title": "让交互更加生动！有意思的鼠标跟随 3D 旋转动效",
@@ -185,9 +167,54 @@
     "url": "https://segmentfault.com/a/1190000041761117",
     "author": "chokcoco",
     "home_url": "https://segmentfault.com/u/chokcoco",
+    "votes": "3",
+    "rank": 19
+  },
+  {
+    "title": "招聘季征文活动获奖名单公布，快来领奖~",
+    "description": "由于疫情原因，快递暂时无法发出，快递可以发出的时候，会尽快给中奖的小伙伴邮寄哒，大家耐心等待哈~哈喽各位社区的小伙伴！2022招聘季有奖征文活动如约开奖啦~废话不多说，我们直接来揭晓获奖名单吧~🌟获奖名单...",
+    "url": "https://segmentfault.com/a/1190000041757846",
+    "author": "SegmentFault思否",
+    "home_url": "https://segmentfault.com/u/segmentfault",
     "votes": "10",
+    "rank": 20
+  },
+  {
+    "title": "图说前端-送给您百张前端技术图谱",
+    "description": "TNTWeb - 全称腾讯新闻前端团队，组内小伙伴在 Web 前端、NodeJS 开发、UI 设计、移动 APP 等大前端领域都有所实践和积累。目前团队主要支持腾讯新闻各业务的前端开发，业务开发之余也积累沉淀了一些前端基础设施...",
+    "url": "https://segmentfault.com/a/1190000041707644",
+    "author": "TNTWEB",
+    "home_url": "https://segmentfault.com/u/tnfe",
+    "votes": "13",
     "rank": 21
   },
+  {
+    "title": "这些CSS提效技巧，你需要知道！",
+    "description": "有梦想，有干货，微信搜索 【大迁世界】 关注这个在凌晨还在刷碗的刷碗智。本文 GitHub [链接] 已收录，有一线大厂面试完整考点、资料以及我的系列文章。",
+    "url": "https://segmentfault.com/a/1190000041711730",
+    "author": "前端小智",
+    "home_url": "https://segmentfault.com/u/minnanitkong",
+    "votes": "12",
+    "rank": 22
+  },
+  {
+    "title": "如何构建可控,可靠,可扩展的 PWA 应用",
+    "description": "PWA （Progressive Web App）指的是使用指定技术和标准模式来开发的 Web 应用，让 Web 应用具有原生应用的特性和体验。比如我们觉得本地应用使用便捷，响应速度更加快等。",
+    "url": "https://segmentfault.com/a/1190000041730906",
+    "author": "JerryC",
+    "home_url": "https://segmentfault.com/u/jerryc",
+    "votes": "6",
+    "rank": 23
+  },
+  {
+    "title": "跨域问题很难吗？来！教你使用 Nginx 反向代理轻松解决",
+    "description": "当你遇到跨域问题，不要立刻就选择复制去尝试。请详细看完这篇文章再处理，我相信它能帮到你。准备前端网站地址：[链接]服务端网址：[链接]首先保证服务端是没有处理跨域的，其次，先用postman测试服务端接口是正...",
+    "url": "https://segmentfault.com/a/1190000041794241",
+    "author": "民工哥",
+    "home_url": "https://segmentfault.com/u/jishuroad",
+    "votes": "9",
+    "rank": 24
+  },
   {
     "title": "一些关于react的keep-alive功能相关知识在这里(上)",
     "description": "这是在2022年开发中PM提的一个需求, 某个table被用户输入了一些搜搜条件并且浏览到了第3页, 那如果我跳转到其他路由后返回当前页面, 希望搜索条件还在, 并且仍处于第三页, 这不就是vue...",
@@ -195,7 +222,7 @@
     "author": "lulu_up",
     "home_url": "https://segmentfault.com/u/lulu_up",
     "votes": "15",
-    "rank": 22
+    "rank": 25
   },
   {
     "title": "一些关于react的keep-alive功能相关知识在这里(下)",
@@ -204,34 +231,34 @@
     "author": "lulu_up",
     "home_url": "https://segmentfault.com/u/lulu_up",
     "votes": "13",
-    "rank": 23
+    "rank": 26
   },
   {
-    "title": "如何构建可控,可靠,可扩展的 PWA 应用",
-    "description": "PWA （Progressive Web App）指的是使用指定技术和标准模式来开发的 Web 应用，让 Web 应用具有原生应用的特性和体验。比如我们觉得本地应用使用便捷，响应速度更加快等。",
-    "url": "https://segmentfault.com/a/1190000041730906",
-    "author": "JerryC",
-    "home_url": "https://segmentfault.com/u/jerryc",
-    "votes": "11",
-    "rank": 24
+    "title": "浅谈支付系统开发基本流程",
+    "description": "前言Hi，各位好久不见，我是CrazyCodes，今天我们来聊聊支付系统。支付系统是每个系统都必备的模块之一，也是众多模块中最核心的功能，如果支付出现问题，那么意味着会直接影响到产品收益，事故严重程度高。本篇...",
+    "url": "https://segmentfault.com/a/1190000041781215",
+    "author": "CrazyCodes",
+    "home_url": "https://segmentfault.com/u/crazycodes",
+    "votes": "14",
+    "rank": 27
   },
   {
-    "title": "这些CSS提效技巧，你需要知道！",
-    "description": "有梦想，有干货，微信搜索 【大迁世界】 关注这个在凌晨还在刷碗的刷碗智。本文 GitHub [链接] 已收录，有一线大厂面试完整考点、资料以及我的系列文章。",
-    "url": "https://segmentfault.com/a/1190000041711730",
-    "author": "前端小智",
-    "home_url": "https://segmentfault.com/u/minnanitkong",
-    "votes": "11",
-    "rank": 25
+    "title": "提高前端人效率的工具、网站和书籍",
+    "description": "提高前端人效率的工具、网站和书籍在线编译（编辑）、playgroundJS 代码混淆www.jsfuck.com/嗯，优点是你可以用来给你的前端工程师好友搞恶作剧，缺点是只能用一次SCSS 转 CSS 在线编译www.sassmeister.com/有时...",
+    "url": "https://segmentfault.com/a/1190000041763788",
+    "author": "playboy5566",
+    "home_url": "https://segmentfault.com/u/playboy5566",
+    "votes": "8",
+    "rank": 28
   },
   {
-    "title": "10个有用的自定义钩子vue.js",
-    "description": "有梦想，有干货，微信搜索 【大迁世界】 关注这个在凌晨还在刷碗的刷碗智。本文 GitHub [链接] 已收录，有一线大厂面试完整考点、资料以及我的系列文章。",
-    "url": "https://segmentfault.com/a/1190000041598901",
-    "author": "前端小智",
-    "home_url": "https://segmentfault.com/u/minnanitkong",
-    "votes": "15",
-    "rank": 26
+    "title": "离谱的 CSS！从表盘刻度到艺术剪纸",
+    "description": "某日，群里有这样一个问题，如何实现这样的表盘刻度：这其实是个挺有意思的问题，方法也有很多。单标签，使用 conic-gradient 实现表盘刻度最简单便捷的方式，就是利用角向渐变的方式 conic-gradient，代码也非常...",
+    "url": "https://segmentfault.com/a/1190000041791819",
+    "author": "chokcoco",
+    "home_url": "https://segmentfault.com/u/chokcoco",
+    "votes": "13",
+    "rank": 29
   },
   {
     "title": "精读《不再需要 JS 做的 5 件事》",
@@ -240,33 +267,6 @@
     "author": "黄子毅",
     "home_url": "https://segmentfault.com/u/aoyangyudakong",
     "votes": "8",
-    "rank": 27
-  },
-  {
-    "title": "硬核 | Redis 布隆（Bloom Filter）过滤器原理与实战",
-    "description": "在Redis 缓存击穿（失效）、缓存穿透、缓存雪崩怎么解决？中我们说到可以使用布隆过滤器避免「缓存穿透」。码哥，布隆过滤器还能在哪些场景使用呀？比如我们使用「码哥跳动」开发的「明日头条」APP 看新闻，如何...",
-    "url": "https://segmentfault.com/a/1190000041686261",
-    "author": "码哥字节",
-    "home_url": "https://segmentfault.com/u/magebyte",
-    "votes": "13",
-    "rank": 28
-  },
-  {
-    "title": "javaScript 内存管理机制",
-    "description": "大家好，今天分享的主题为 JavaScript 内存管理机制，本次分享将从以下三部分进行讲述：js 内存管理与 js 垃圾常见的 GC 算法V8 引擎的垃圾回收js 内存管理与 js 垃圾关于 JavaScript 内存管理机制，相信大家都有...",
-    "url": "https://segmentfault.com/a/1190000041701063",
-    "author": "云叔_又拍云",
-    "home_url": "https://segmentfault.com/u/yunshu_blog",
-    "votes": "11",
-    "rank": 29
-  },
-  {
-    "title": "初级程序员的SQL拾遗（增删改查）",
-    "description": "虽然平时开发中经常接触MySQL，但大多数的数据库操作都是通过ORM实现的（SpringDataJPA），自己并没有从底层接触SQL。再加上笔者非专业的身份，对于原生的SQL语句几乎完全不了解。本文是写给自己的，关于原生SQL...",
-    "url": "https://segmentfault.com/a/1190000041753021",
-    "author": "LYX6666",
-    "home_url": "https://segmentfault.com/u/liuyuxuan6666",
-    "votes": "10",
     "rank": 30
   }
 ]