文章教你如何做掘金站内数据抓取，数据解析，最后形成排序后的排名。

0821更新：掘金总点赞量前 5000 排行发布 | 掘金总关注量前 5000 排行(20190821)

0827更新：【第三方掘金功能】掘金个人数据统计，第三方实现的掘金用户 dashboard

项目起因是我突然想看看掘金站内有哪些优质作者，为了不错过每一个大佬，我选择直接抓取站内所有的文章信息找到作者并进行排名。各位关注 + 文章阅读一条龙走起！

项目地址 juejin-spider 欢迎 star issue

掘金 spider 和数据分析，主要关注了下面几个排行和统计，排行点击直接查看

先上掘金前50排名，关注一波？？？？ 前5000排名看这里

🎉 等级，👦 关注数，🏠公司

(1)[🎉 4][👦 67909] [🏠 掘金] 阴明
(2)[🎉 5][👦 47061] [🏠 稀土] 稀土君
(3)[🎉 5][👦 45676] [🏠 Alibaba] HollisChuang
(4)[🎉 5][👦 44229] [🏠 ] 腾讯云加社区
(5)[🎉 3][👦 37565] [🏠 前端外刊评论网] 前端外刊评论
(6)[🎉 0][👦 37062] [🏠 SN] 丁一
(7)[🎉 3][👦 34825] [🏠 腾讯alloyteam -> 腾讯云 -> Shopee] 李CHENGXI
(8)[🎉 3][👦 34588] [🏠 ] liutao
(9)[🎉 3][👦 33436] [🏠 易快报] 水墨寒
(10)[🎉 1][👦 30516] [🏠 前掘金] NeXT
(11)[🎉 4][👦 28101] [🏠 公众号【远洋号】] 超人汪小建
(12)[🎉 4][👦 27221] [🏠 ] stormzhangV
(13)[🎉 5][👦 25833] [🏠 ] Java3y
(14)[🎉 2][👦 25707] [🏠 吆喝科技] 吆喝科技_Zoran
(15)[🎉 5][👦 25237] [🏠 美团] 美团技术团队
(16)[🎉 0][👦 23913] [🏠 ] 刘欣
(17)[🎉 6][👦 23829] [🏠 宋小菜] yck
(18)[🎉 5][👦 22345] [🏠 公众号『crossoverJie』] crossoverJie
(19)[🎉 6][👦 21367] [🏠 ] 技术胖
(20)[🎉 5][👦 21170] [🏠 ] 石杉的架构笔记
(21)[🎉 3][👦 21100] [🏠 阿里巴巴集团] 闲鱼技术
(22)[🎉 1][👦 20815] [🏠 滴滴] 孙福生
(23)[🎉 5][👦 20785] [🏠 前网易，现哈啰] 木易杨说
(24)[🎉 2][👦 20642] [🏠 弋云科技] AleCC
(25)[🎉 0][👦 20562] [🏠 滴滴出行] five_years_struggle
(26)[🎉 5][👦 20196] [🏠 ThoughtWorks准入职] SnailClimb
(27)[🎉 2][👦 20065] [🏠 ofo] 猴子搬来的救兵
(28)[🎉 3][👦 20058] [🏠 HUAWEI] 雨神姥爷
(29)[🎉 2][👦 19307] [🏠 金融科技] taotao.li
(30)[🎉 4][👦 19068] [🏠 公众号【码洞】] 老錢
(31)[🎉 2][👦 18847] [🏠 ] 凤尾
(32)[🎉 5][👦 18465] [🏠 ] 冴羽
(33)[🎉 5][👦 18390] [🏠 腾讯微信] Carson_Ho
(34)[🎉 2][👦 18318] [🏠 zhisheng] zhisheng
(35)[🎉 0][👦 17887] [🏠 自由职业] IT程序狮
(36)[🎉 3][👦 17741] [🏠 Goertek] 泱泱
(37)[🎉 4][👦 17633] [🏠 纯源码解析，目前源码解析500+篇] 芋道源码_以德服人_不服就干
(38)[🎉 3][👦 17588] [🏠 胖橘网络] KyXu
(39)[🎉 5][👦 17535] [🏠 Fundebug] Fundebug
(40)[🎉 0][👦 16984] [🏠 腾讯] flike
(41)[🎉 3][👦 16962] [🏠 百度] 胡子大哈
(42)[🎉 4][👦 16827] [🏠 ] 老司机iOS周报
(43)[🎉 4][👦 16364] [🏠 ] 机器之心
(44)[🎉 1][👦 15699] [🏠 AXE] 果只
(45)[🎉 3][👦 15466] [🏠 ] Mockplus
(46)[🎉 5][👦 15448] [🏠 腾讯科技(深圳)有限公司] 腾讯IVWEB团队
(47)[🎉 6][👦 15421] [🏠 上海] OBKoro1
(48)[🎉 5][👦 15362] [🏠 ELEME] sunshine小小倩
(49)[🎉 2][👦 15164] [🏠 ucashin.com] MrMuscles
(50)[🎉 3][👦 15077] [🏠 ] 已禁用

脚本

全站标签抓取

获取掘金站内所有标签信息

npm run tagList

会把标签信息写入到 src/assets/tagList/tagList.json，每个标签包含下面的信息，主要是 title 和 id

{
  "id": "5597a063e4b08a686ce57030",
  "title": "后端",
  "createdAt": "2015-07-04T00:59:16Z",
  "updatedAt": "2017-06-18T23:34:00Z",
  "color": "#C679FF",
  "icon": "https://p1-jj.byteimg.com/tos-cn-i-t2oaga2asx/leancloud-assets/d83da9d012ddb7ae85f4.png~tplv-t2oaga2asx-image.image",
  "background": "",
  "showOnNav": true,
  "relationTagId": "",
  "alias": "backend houduan",
  "isCategory": true,
  "entryCount": 19840,
  "subscribersCount": 295562,
  "isSubscribe": false
},

全站文章抓取

将会采集全站所有标签下面的所有文章，采集过程会因为网速和机器性能表现出差异，请各位耐心等待采集完成

这一步采集的数据非常重要，是后面所有分析的基础

采集到的文件会存放在 src/assets/articleData 下面，包含有很多 json 文件，每个文件包含这个标签下的所有专栏文章元信息

npm run allTagData

数组中每个对象

{
  "collectionCount": 5, // 点赞数
  "userRankIndex": 5.4006856695164,
  "buildTime": 1565582852.8327,
  "commentsCount": 2, // 评论数
  "gfw": false,
  "objectId": "5d40d29d518825221b4cbb40",
  "checkStatus": true,
  "isEvent": false,
  "entryView": "",
  "subscribersCount": 0, // 无用
  "ngxCachedTime": 1565627197,
  "verifyStatus": true,
  "tags": [
    {
      "ngxCachedTime": 1565627193,
      "ngxCached": true,
      "title": "React.js",
      "id": "555e99ffe4b00c57d99556aa"
    }
  ],
  "updatedAt": "2019-08-12T04:07:32.818Z",
  "rankIndex": 0.005346156248974,
  "hot": false,
  "autoPass": false,
  "originalUrl": "https://juejin.cn/post/6844903903058739213", // 文章的 url
  "verifyCreatedAt": "2019-07-31T01:36:14.238Z",
  "createdAt": "2019-07-31T01:36:14.238Z",
  "user": {
    "community": {
      "weibo": { "uid": "5345591282", "nickname": "岁月痕迹A88" },
      "wechat": {
        "avatarLarge": "http://thirdwx.qlogo.cn/mmopen/vi_32/cabLXAUXiavVhiaDh2050AOOEToUvnZTWsSNqqKZC4hzPzHABC7fxwv6VxwebIxfKdaRkYDZoic8UXfonLDyiafuiaw/132"
      },
      "github": {
        "username": "lxfriday",
        "avatarLarge": "https://avatars0.githubusercontent.com/u/20264467?v=4",
        "uid": "20264467"
      }
    },
    "collectedEntriesCount": 154, // 点赞数
    "company": "xxx", // 公司
    "followersCount": 35, // 被关注数
    "followeesCount": 70, // 关注数
    "role": "guest", // 用户角色
    "postedPostsCount": 19, // 发布的专栏数
    "level": 2, // 用户等级
    "isAuthor": false,
    "postedEntriesCount": 2, // 分享数？
    "totalCommentsCount": 16, // 总评论数
    "ngxCachedTime": 1565627197,
    "viewedEntriesCount": 1347, // 查看的文章数
    "jobTitle": "前端", // 工作：前端
    "subscribedTagsCount": 166, // 关注的标签数
    "totalCollectionsCount": 120, // 总收藏数
    "username": "云影sky", // 用户名
    "avatarLarge": "https://p1-jj.byteimg.com/tos-cn-i-t2oaga2asx/gold-user-assets/2019/7/14/16bf1155693d96c2~tplv-t2oaga2asx-image.image",
    "objectId": "57a0c28979bc440054958498" // 用户 id
  },
  "author": "",
  "screenshot": "https://p1-jj.byteimg.com/tos-cn-i-t2oaga2asx/gold-user-assets/2019/7/29/16c3e3d979a96831~tplv-t2oaga2asx-image.image",
  "original": true,
  "hotIndex": 21.2095,
  "content": "给 PureComponent 重新指向构造函数之后，_assign 复制对象属性时， Component 构造函数不会覆盖 PureComponent 构造函数，看下面的例子就明白了。 把 PureComponent 变成 Component，userInfo 可正常变化。",
  "title": "React 源码系列-Component、PureComponent、function Component 分析",
  "lastCommentTime": "2019-08-03T16:53:20.577Z",
  "type": "post",
  "english": false,
  "category": {
    "ngxCached": true,
    "title": "frontend",
    "id": "5562b415e4b00c57d9b94ac8",
    "name": "前端",
    "ngxCachedTime": 1565627098
  },
  "viewsCount": 267, // 浏览量
  "summaryInfo": "经过 处理之后，三个组件的区别就是 type 不一样了 和 看不懂可以看下这篇文章 https://www.zhihu.com/question/34183746 js 中 和 的区别和关系 函数的 属性对象上的 是不可枚举的，所以下面两句 给 PureComponent 重新指向构造函数之后， ...",
  "isCollected": false
}

关注量排行

获取站内浏览量

npm run follower

脚本执行完成会产生两个文件

src/assets/calcUserRank/用户followerRank.json 是排行后的元信息
src/assets/calcUserRank/用户followerRank.md 按排名编排的 md 文档

点赞排行

获取站内点赞排行

npm run dianzan

脚本执行完成会产生两个文件

src/assets/calcDianzanRank/点赞rank.json 是排行后的元信息
src/assets/calcDianzanRank/点赞rank.md 按排名编排的 md 文档

例子

(1)[👍 5409][📌 程序员] 前端 100 问：能搞懂 80% 的请把简历给我
(2)[👍 4416][📌 Vue.js] 2018前端面试总结，看完弄懂，工资少说加3K | 掘金技术征文

全站文章浏览量排行

获取站内浏览量

npm run view

脚本执行完成会产生两个文件

src/assets/calcViewRank/浏览量rank.json.json 是排行后的元信息
src/assets/calcViewRank/浏览量rank.json.md 按排名编排的 md 文档

全站文章评论量排行

获取站内浏览量

npm run comment

脚本执行完成会产生两个文件

src/assets/calcCommentRank/calcCommentRank.json 是排行后的元信息
src/assets/calcCommentRank/calcCommentRank.md 按排名编排的 md 文档

技术解析

async 并发控制
chalk 多彩命令行
request 发送 http 请求
request-promise 把 request promise 化，方便使用 async

项目辅助工具 dev assistant

commitlint 规范 commit message
eslint 大家都懂
prettier 自动格式化代码
husky 提供 git 钩子
lint-staged 只对当前变动的文件执行格式化和 eslint 校验
jest 测试排序算法正确性

前 1000、前 5000 在20w条数据中是如何计算的

构建小顶堆，不断往堆中添加数据，比堆顶小的直接抛弃，比堆顶大的，替换成堆顶并对二叉树进行调整，维持小顶堆。遍历所有数据之后小顶堆就是我们要的所有最大值排行，再对这个数组排序依次就可以获取排名了！！！

排序算法 sortPrev
使用计算全站文章浏览量排行


// 最小值上浮
function heapify(arr, len, i, compareVal) {
  let min = i
  const l = 2 * i + 1
  const r = 2 * i + 2

  if (l < len && compareVal(arr[l]) < compareVal(arr[min])) min = l
  if (r < len && compareVal(arr[r]) < compareVal(arr[min])) min = r

  if (min !== i) {
    swap(arr, i, min)

    heapify(arr, len, min, compareVal)
  }
}

/**
 * 对 target 建堆
 * @param {array} target 堆数组
 * @param {*} compareVal 从 dataUnit 对象获取比对值
 */
function createHeap(target, compareVal = v => v) {
  for (let i = Math.floor((target.length - 1) / 2); i >= 0; i--) {
    heapify(target, target.length, i, compareVal)
  }
}

function findMaxPrev(dataUnit, target, compareVal = v => v) {
  if (compareVal(dataUnit) > compareVal(target[0])) {
    target[0] = dataUnit
    heapify(target, target.length, 0, compareVal)
  }
}

排行

浏览量排行

👀 浏览量，📌 标签

(1)[👀 817784][📌 Android] 蜻蜓FM 涉嫌诈骗投资人和广告主源代码剖析
(2)[👀 471926][📌 Vue.js] 手摸手，带你用vue撸后台系列一（基础篇）
(3)[👀 336824][📌 Vue.js] 手摸手，带你用vue撸后台系列二(登录权限篇)
(4)[👀 261110][📌 面试] 中高级前端大厂面试秘籍，为你保驾护航金三银四，直通大厂(上)
(5)[👀 173030][📌 程序员] 前端 100 问：能搞懂 80% 的请把简历给我
(6)[👀 147633][📌 Go] Gos: GO MODULE解决方案 💪
(7)[👀 143114][📌 JavaScript] 首个微信小程序开发教程！
(8)[👀 140469][📌 Vue.js] 手摸手，带你用vue撸后台系列三(实战篇)
(9)[👀 139499][📌 Vue.js] 2018前端面试总结，看完弄懂，工资少说加3K | 掘金技术征文
(10)[👀 137958][📌 Vue.js] 手摸手，带你用vue撸后台系列四(vueAdmin 一个极简的后台基础模板)
(11)[👀 120472][📌 JavaScript] 一个合格的中级前端工程师必须要掌握的 28 个 JavaScript 技巧
(12)[👀 116779][📌 程序员] 疑因内部宫斗被离职，中兴70后程序员从公司坠楼
(13)[👀 105344][📌 JavaScript] 这一次，彻底弄懂 JavaScript 执行机制
(14)[👀 100848][📌 GitHub] 2018 Java 后端工程师的书单推荐
(15)[👀 98813][📌 JavaScript] 一名【合格】前端工程师的自检清单
(16)[👀 95634][📌 JavaScript] 知道这 20 个正则表达式，能让你少写 1,000 行代码
(17)[👀 89452][📌 前端] ES6、ES7、ES8、ES9、ES10新特性一览
(18)[👀 88587][📌 Android] RxJava2 只看这一篇文章就够了
(19)[👀 86096][📌 Vue.js] 手摸手，带你优雅的使用 icon
(20)[👀 84639][📌 开源] 中国首位00后CEO公然抄袭、复制我的开源作品

点赞量排行

👍 点赞数，📌 标签

(1)[👍 5488][📌 程序员] 前端 100 问：能搞懂 80% 的请把简历给我
(2)[👍 4431][📌 Vue.js] 2018前端面试总结，看完弄懂，工资少说加3K | 掘金技术征文
(3)[👍 4368][📌 JavaScript] 这一次，彻底弄懂 JavaScript 执行机制
(4)[👍 4216][📌 面试] 一个合格(优秀)的前端都应该阅读这些文章
(5)[👍 4183][📌 面试] 中高级前端大厂面试秘籍，为你保驾护航金三银四，直通大厂(上)
(6)[👍 3890][📌 JavaScript] 一名【合格】前端工程师的自检清单
(7)[👍 3807][📌 Vue.js] 近两万字小程序攻略发布了
(8)[👍 3701][📌 JavaScript] 一个合格的中级前端工程师必须要掌握的 28 个 JavaScript 技巧
(9)[👍 3664][📌 React.js] 技术胖155集前端视频教程-全部免费观看
(10)[👍 3551][📌 Android] Kotlin 资源大全 - 学 Kotlin 看这一篇教程就够了
(11)[👍 3342][📌 HTML] 前端常用插件、工具类库汇总，不要重复造轮子啦！！！
(12)[👍 3338][📌 Vue.js] 新年献礼技术胖262集前端免费视频让您走的更容易些
(13)[👍 3205][📌 JavaScript] 知道这 20 个正则表达式，能让你少写 1,000 行代码
(14)[👍 3202][📌 前端] 总结了17年初到18年初百场前端面试的面试经验(含答案)
(15)[👍 2958][📌 前端框架] 大型项目前端架构浅谈（8000字原创）
(16)[👍 2932][📌 React.js] 2018春招前端面试: 闯关记(精排精校) | 掘金技术征文
(17)[👍 2902][📌 Vue.js] 手摸手，带你用vue撸后台系列一（基础篇）
(18)[👍 2879][📌 JavaScript] 个人分享--web前端学习资源分享
(19)[👍 2871][📌 CSS] 你未必知道的49个CSS知识点
(20)[👍 2846][📌 JavaScript] JavaScript深入系列15篇正式完结！
(21)[👍 2743][📌 React.js] 2018上半年掘金微信群日报优质文章合集：前端篇
(22)[👍 2643][📌 后端] 后端架构师技术图谱
(23)[👍 2538][📌 Vue.js] Vue 项目里戳中你痛点的问题及解决办法（更新）
(24)[👍 2520][📌 JavaScript] webpack详解
(25)[👍 2481][📌 Android] 花了 4 个月整理了 50 篇 Android 干货文章
(26)[👍 2468][📌 Vue.js] vue中Axios的封装和API接口的管理
(27)[👍 2439][📌 CSS] 干货!各种常见布局实现+知名网站实例分析
(28)[👍 2427][📌 JavaScript] JavaScript专题系列20篇正式完结！
(29)[👍 2371][📌 React.js] 年终回顾，为你汇总一份「前端技术清单」
(30)[👍 2340][📌 CSS] 关于移动端适配，你必须要知道的
(31)[👍 2301][📌 HTML] 前端开发者指南（2017）
(32)[👍 2279][📌 前端] 总有你要的编程书单（GitHub）
(33)[👍 2247][📌 程序员] 一个前端的2018总结，2019展望 | 掘金年度征文
(34)[👍 2243][📌 React.js] 前端面试考点多？看这些文章就够了（2019年6月更新版）
(35)[👍 2239][📌 React.js] 四月前端知识集锦（每月不可错过的文章集锦）
(36)[👍 2219][📌 JavaScript] 前端进阶必备，github 优质资源整理分享！
(37)[👍 2211][📌 HTML] 前端必会的 Nginx入门视频教程(共11集)
(38)[👍 2207][📌 Android] Android 面试知识库
(39)[👍 2191][📌 JavaScript] 「中高级前端面试」JavaScript手写代码无敌秘籍
(40)[👍 2189][📌 JavaScript] JS正则表达式完整教程（略长）
(41)[👍 2178][📌 前端] ES6、ES7、ES8、ES9、ES10新特性一览
(42)[👍 2177][📌 React.js] 2万5千字大厂面经 | 掘金技术征文
(43)[👍 2155][📌 Vue.js] Vue 2.x脱坑记 - 查漏补缺(汇总下群里高频询问的xxx及给出不靠谱的解决方案)
(44)[👍 2141][📌 CSS] webpack4-用之初体验，一起敲它十一遍
(45)[👍 2140][📌 Angular.js] 前端知识点大百科全书
(46)[👍 2132][📌 面试] 记录面试中一些回答不够好的题（Vue 居多） | 掘金技术征文
(47)[👍 2064][📌 JavaScript] JavaScript 复杂判断的更优雅写法
(48)[👍 2060][📌 面试] 1月前端面试记
(49)[👍 2019][📌 CSS] 一劳永逸的搞定 flex 布局
(50)[👍 2013][📌 JavaScript] 首个微信小程序开发教程！

'掘金' === '前端社区' ????

评论量排行

🐶 评论数，📌 标签

(1)[🐶 756][📌 程序员] 一个前端的2018总结，2019展望 | 掘金年度征文
(2)[🐶 607][📌 Vue.js] 新年献礼技术胖262集前端免费视频让您走的更容易些
(3)[🐶 570][📌 稀土] 不如我们从头来过 | 掘金
(4)[🐶 468][📌 JavaScript] 一名【合格】前端工程师的自检清单
(5)[🐶 456][📌 沸点] AMA：我是安卓开发者扔物线（朱凯），你有问题问我吗？
(6)[🐶 452][📌 沸点] 晒晒你的电脑桌面 | 程序员的桌面是什么样的？
(7)[🐶 445][📌 JavaScript] 这一次，彻底弄懂 JavaScript 执行机制
(8)[🐶 438][📌 TypeScript] 抛弃 JS，使用 TypeScript
(9)[🐶 418][📌 沸点] 沸点：晒晒你们公司发的中秋福利
(10)[🐶 404][📌 沸点] 沸点：说说你目前在学习什么？
(11)[🐶 403][📌 沸点] 老板问需求多久能开发完，你怎么回答？
(12)[🐶 398][📌 开源] 中国首位00后CEO公然抄袭、复制我的开源作品
(13)[🐶 396][📌 面试] 中高级前端大厂面试秘籍，为你保驾护航金三银四，直通大厂(上)
(14)[🐶 391][📌 程序员] 沸点：2017 年已经过去一半了，用一句话总结一下上半年
(15)[🐶 388][📌 程序员] 沸点第十六期：你写代码的时候都在听什么歌？
(16)[🐶 387][📌 Google] 你最喜欢的 Google 开发技术是什么？评论送 Google 限量音箱，电脑包
(17)[🐶 359][📌 前端] 关于IT培训机构的个人看法
(18)[🐶 357][📌 创业] 沸点第三十六期：你怎么看待 996 工作制？回答沸点送章鱼猫和掘金T恤
(19)[🐶 354][📌 前端框架] 大型项目前端架构浅谈（8000字原创）
(20)[🐶 344][📌 GitHub] 培训机构让Github的含金量降低了？

分析的内容就是这些了，我还统计了掘金站内的总的文章数和在标签下发布文章的用户总数

掘金站内去重后总的文章数：10w 左右，可能统计有很大误差，去重前是 20+w
标签下发布文章的用户总数：1.5w 左右

看看 npm scripts 开始玩耍吧

npm run all 一行命名抓取数据分析全流程走完，整个流程处理的数据量比较大，需要半个小时左右

"scripts": {
    "all": "npm run tagList && npm run allTagData && npm run dianzan && npm run view && npm run comment && npm run follower",
    "start": "npm run tagList",
    "tagList": "TASK=tagList node App.js",
    "allTagData": "TASK=allTagData node App.js",
    "composeArticleData": "TASK=composeArticleData node App.js",
    "userData": "TASK=userData node App.js",
    "dianzan": "TASK=dianzan node App.js",
    "view": "TASK=view node App.js",
    "comment": "TASK=comment node App.js",
    "follower": "TASK=follower node App.js",
    "lint": "eslint .",
    "test": "jest"
},

最后欢迎大家关注我的 github 和微信公众号

GitHub
微信公众号