乐趣区

关于前端:开阔眼界的好工具一文教你使用Wappalzer来学习全栈技术

一、前言

我先抛出一个问题,市面上这么多相干的技术和计划,如果让你来设计一套 Web 零碎,你会怎么抉择?

大家都晓得,一个残缺的 高可用、高性能 的 Web 零碎自身的形成是比较复杂的,除了咱们熟知的前端局部,比方 动态网页生成器、JS 库、UI 框架、监控工具 等,还有 Web Server、云服务、CDN 内容散发、代理服务、HTTP 缓存与减速 等等。

有人会说,我会依照我最相熟的计划来设计,这样危险最小。
有人会说,我会先 Google 一些成熟的计划,而后别离预研一下,应用成果最好的计划。
有人会说,我会间接找技术大牛,他做的肯定没问题。

其实只有后果是好的,最终落地胜利,成果甚好,那么技术计划怎么选都没有错。

然而如果我通知你,当初市面上各大网站的技术栈我都晓得个百分之六七十,前端框架用的什么,服务器用的什么,后端用的什么,CDN 用的什么等等,你会先听听我的倡议么?我置信你会的。

Wappalzer就是这样一款弱小的浏览器插件,它的用户超过 100 万,并且它的应用超级简略,只须要点一下,就能看到以后你拜访的网站所应用的技术栈。先让咱们看看 Segmentfault 用了哪些技术吧。

二、发现你不晓得的技术

那么第二个问题来了,如果你是个有教训的架构师,那么 Wappalzer 对你的帮忙可能不大。然而如果你只是一个前端工程师或者后端工程师,当初你要担负起全栈的工作,负责本人不太熟悉的那局部内容,并且要给出技术计划,可能是个头疼的问题。因为对于前端工程师来说,服务器用什么?后端语言用什么?数据库用什么?搜索引擎用什么?云服务用亚马逊、微软的还是阿里、腾讯的?这一些列问题对于很少接触服务端的人来说,都是一个不小的挑战。因为好多技术我都没听过,更何谈抉择呢?

这时候 Wappalzer 就派上用场了,你只须要不停地关上各个网站,看下它给你列出的技术清单,你便很快能通晓一些你不相熟的技术。

接下来咱们测试测试,看看是否真的有用。

首先关上 Github,看看他们用到的一些技术

OK,从它给出的技术清单来看,我不晓得的有 lit-htmlAmazon S3Turbo 这三个技术,于是咱们只须要点进去看看即可。以 Turbo 为例,点进去之后,Wappalyzer 简略的介绍了 Turbo 是干什么的,并且给出了官网链接。我晓得了它是一个用来疾速构建 Web 利用的 JS 框架。那么这个没听过的技术是不是很冷门呢?接着往下翻,它还列出了拜访浏览最高的 10 个应用该技术的网站列表。

再来看看 Amazon S3 是什么?

它是亚马逊的对象存储服务,接下来咱们看看哪些网站应用了它。能够看到,应用它的都是十分闻名的网站,包含了 linkedin、figma、notion、spotify 等等。足以阐明亚马逊的对象存储是个很靠谱的服务,抉择它没什么问题。

好了,以上咱们用 Github 为例,简略介绍了 Wappalzer 的应用办法。大家可能会发现,其实列出的技术清单也并不是很多,这其实和你拜访的网站密不可分,有些技术是很难被探测进去的。

三、横向比照同一畛域应用的技术

第三个问题,当我理解到了一些我不晓得的技术后,是否我就能够间接采纳这项技术了呢?非也,一项技术的落地肯定和整个生态链以及我的项目的整体技术架构非亲非故。所以咱们并不能繁多地决定咱们是否能采纳这项技术。最好的方法之一,咱们能够对雷同类型的网站进行剖析,看看他们对于繁多性能是否应用了雷同或不同的技术,以便于咱们进行技术的剖析和抉择。

接下来咱们以 StackoverFlowSegmentfault为例,两者都是问答类技术网站,应用人数都很多,那么咱们比照一下他们应用的技术。

Segmentfault

StackoverFlow

从下面两张图的技术清单来看,雷同的技术有 Google Analytics、Webpack、Highlight.js、Google Tag Manager。前端的技术咱们就不说了,来看看这个Google Tag Manager 是什么东东。它是一个标签管理系统(TMS),容许在你的网站或挪动应用程序上,疾速和轻松地更新测量代码和相干代码片段作为标签。

再来看看哪些网站应用了它

那么通过横向比照咱们当初晓得了,博客零碎、招聘网站、问答类零碎都在应用这个技术,如果你的零碎也有相似打标签的性能,能够放心使用Google Tag Manager

四、这项技术真的过期了吗?

第四个问题,咱们都晓得,前端工程化之后,随着各个前端框架的层出不穷,jQuery这项技术显著受到了排斥和争光,甚至很多人看不起应用 jQuery 的前端,认为这是一种 low 的体现。作为一个常常应用 jQuery 的前端工程师,我想反驳却不晓得从何反驳。这时 Wappalzer 成了我最好的帮手,咱们只须要点开那些最闻名的网站,看看是否还在应用 jQuery 即可。

之前咱们曾经看到 Github、StackoverFlow 都还在应用 jQuery,那咱们就点进去看看还有其余哪些网站在应用。

能够看到,WordPress、codeopen、gitlab、CSDN等网站都在应用它,不论是历史遗留起因还是真的须要,都证实了 jQuery 这项技术并不过时。它的定位和古代前端框架自身就不同,不应该受到不公正的评估。

五、寻找替代品

Wappalzer还有个弱小的性能,那就是列出了往年最火爆的代替技术,以刚刚的 Google Tag Manager 为例,看看它的替代品有哪些。

当咱们点进某个替代品,会列出两个技术的比照项

六、更多功能

Wappalzer 还有其余十分多的性能,包含会通知你这项技术哪些地区应用最多等。甚至还有免费性能,能够查到更多的技术细节。心愿大家能够好好利用这项工具,关上本人的视线。

退出移动版