查看原文
其他

前端周刊 | AngularJS 停止长期支持; 知名开源库遭开发者恶意破坏; GitHub开源趋势; Firefox 96发布

CUGGZ 前端充电宝 2022-07-21

大家好,我是CUGGZ,时隔多天,前端周刊又更新啦!这是2022年第一期周刊,更新时间也由周日改成了周一。每次周刊都至少需要整理三四个小时,如果觉得有一点点用,就点个赞和在看吧

科技趣闻

1. AngularJS 官方已停止长期支持

2018 年 1 月,AngularJS团队制定了 AngularJS 长期支持的最终版本的计划,去年,由于新冠疫情全球大流行,团队将 LTS 延长至 2021 年 12 月 31 日。2022年1月,AngularJS官方团队宣布不再进行长期支持,但是用户仍然可以寻求第三方支持,包括支持服务公司XLTS.dev和Perforce。AngularJS 源代码仍将通过 NPM、CDN 和 Bower 在GitHub 上提供。

维基百科对AngularJS 的介绍:

AngularJS是一款由Google维护的开源JavaScript库,用来协助单一页面应用程序运行。它的目标是透过MVC模式(MVC)功能增强基于浏览器的应用,使开发和测试变得更加容易。

AngularJS的理念是声明式编程应该用于构建用户界面以及编写软件构建,而指令式编程非常适合来表示业务逻辑。框架采用并扩展了传统HTML,通过双向的数据绑定来适应动态内容,双向的数据绑定允许模型和视图之间的自动同步。

作为这种新的长期状态的一部分,团队可以期待以下内容:

  • CDN 链接将保持活动状态,AngularJS.org将保持在线;
  • 将通过归档angular.js存储库和相关存储库(即AngularJS Material、bower-material等)来提供对 GitHub 上代码、问题和拉取请求历史记录的只读访问权限;
  • AngularJS npm 包将保留在 npm 和 bower 上,标记为已弃用。

详见:https://blog.angular.io/discontinued-long-term-support-for-angularjs-cc066b82e65a

2. 拒绝白嫖,Faker.js 和 colors.js 开源库遭开发者恶意破坏

近期,faker.js 和 colors.js两个知名开源库遭到破坏。它们并不是被外人劫持的,而是他们的创建者在软件库中故意引入了一个无限循环,导致它们出现了故障。这些开源软件的应用特别广泛,所以这个事件影响也特别深远。

colors.js 是一个用于处理颜色的 Java 库,faker.js 是一个用于生成假数据的 Java 库。这两个包特别受开发者欢迎,其中 colors 包在 npm 上就拥有每周 2000 多万次下载量,依赖于它的项目近 19000 个。faker 在 npm 上每周下载量超过 280 万次,相关项目超 2500 个,faker 的受欢迎程度可媲美于 Vue

开发者 Marak Squires 向 colors.js 包的 v1.4.44-liberty-2 版本中添加了“新的美国国旗模块”,此项变更随后被推送至 GitHub 与 npm。

Squires 声称不想自己的努力再被财富 500 强(以及其他小型公司)白嫖,并希望拿到一份年薪六位数的合同。或者分叉项目,找其他人接手。

同样,faker 的恶作剧版本“6.6.6”也被发布到了 GitHub 和 npm 之上。这位开发者还语带嘲讽地表示,“我们注意到 v1.4.44-liberty-2 版本的 colors 中存在一项 Zalgo bug。”“我们正在努力解决这个问题,请大家静待解决方案的发布。”所谓 Zalgo 文本,指的就是因某些故障引发的非 ASCII 字符。

此事件之后,开源业界开始普遍担忧,认为大企业们已经习惯于压榨开源成果、不停消耗,但却没有给予足够的回报来支持这些志愿放弃空闲时间来维持关键项目的贡献者。对于开源软件生态到底能不能长久存续,恐怕也只有时间能给出答案了。

对于这件事,你怎么看?

3. FireFox火狐浏览器无法上网原因查明:代码大小写写错

近期,在用FireFox火狐浏览器的用户可能会出现无法连接上网的问题,起初以为是新版升级的问题(最近更新了96版本),现在问题查明是火狐自己的问题,部分代码的大小写写错了。

根据官方介绍,在解析HTTP标头时,FireFox会用一个函数结束,该函数通常只处理大写的字段,如果是小写的字母那就会无法计算标头长度,从而导致FireForx代码陷入无限循环中。修复完成之后,未来这个代码不会再区分大小写了。

更新速递

1. Firefox 96 发布

Firefox 96 于 2022 年 1 月 11 日发布,它支持Windows、Linux、macOS三大平台。Firefox 96大幅减少了主线程负载,意味着可以明显降低对系统资源的占用,运行更快速、更流畅。该版本主要有以下更新:

  • 实现了hwb()用作CSS 颜色值的功能;
  • 提供对color-scheme属性的支持,它允许元素指示它可以舒适地呈现在哪些颜色方案中;
  • 为WebP 图像格式添加了图像编码器支持;
  • 修复了某些网站上的视频质量下降问题;
  • 修复了 WebRTC 降低屏幕共享分辨率的问题,提供清晰的浏览体验。

更多更新详见:https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/96

2. Relay 13 发布

Relay V13.0.0 版本正式发布。

Relay 是构建数据驱动 React 应用的 JavaScript 框架。主要特性:

  • 声明式: 不再使用一个命令式 API 与数据存储通讯。简单的使用 GraphQL 声明你的数据需求,让 Relay 理解如何,什么时候获取你的数据。
  • 托管: 查询在视图后面,Relay 聚合查询成有效的网络请求,只获取你需要的数据。
  • 转变: Relay 允许使用 GraphQL mutations 在客户端和服务器端转变数据,提供自动数据一致,优化更新和错误处理。

更新内容详见:https://github.com/facebook/relay/releases/tag/v13.0.0

3. D3.js v7.3.0 发布

D3.js 发布 v7.3.0 版本。

D3js 是一个可以基于数据来操作文档的 JavaScript 库。可以帮助你使用 HTML, CSS, SVG 以及 Canvas 来展示数据。D3 遵循现有的 Web 标准,可以不需要其他任何框架独立运行在现代浏览器中,它结合强大的可视化组件来驱动 DOM 操作。

更新内容详见:https://github.com/d3/d3/releases/tag/v7.3.0

开源前线

下面来看看本周GitHub上新增star较多的有趣的前端项目。

1. 30-Days-Of-JavaScript

30-Days-Of-JavaScript 是在 30 天内学习 JavaScript 编程语言的分步指南。此挑战可能需要100多天,请按照自己的节奏进行。该项目适合JavaScript初学者,分步学习JavaScript。

Star⭐:14.2k

本周Star⭐️:1778

Github地址:https://github.com/Asabeneh/30-Days-Of-JavaScript

2. zx

zx 是一个更方便、更友好地帮助开发者写脚本的工具,由谷歌开源和负责维护。它也是2021年最热门的GitHub前端开源项目。

虽然 Bash 十分好用,但在编写脚本的时候,大家通常会选择一种更方便的编程语言,例如 JavaScript 就是一个很完美的方案。不过标准的 Node.js 库在使用之前需要许多额外的操作,整体来说还是不够方便。如果你对一些 linux 或者 window 等平台的命令行比较熟悉,并且会一些 JavaScript 的语法,那么使用这个工具就可以得心应手。

Star⭐:26.2k

本周Star⭐️:1070

Github地址:https://github.com/google/zx

3. Superset

Superset是一款由Airbnb开源的、目前由Apache孵化的,基于Flask-appbuilder搭建的“现代化的企业级BI(商业智能)Web应用程序”,它通过创建和分享dashboard,为数据分析提供了轻量级的数据查询和可视化方案。

Superset 自带SQLite数据库并支持连接Hive、Impala、MySql、Oracle等几乎所有主流的数据源;支持和弦图、事件流图、热力图、视图表等及其它常规的可视化展示图表;支持可控的数据展示,能自定义展示字段、数据源等;支持权限控制,以满足不同使用人员对数据和数据库的权限要求;同时内含SQL查询面板模块、具有较美观友好的操作界面等。

Star⭐:43.8k

本周Star⭐️:900

Github地址:https://github.com/apache/superset

4. Astro

Astro 是一种用于现代的新型静态站点构建器。它提供了多种静态网站模板供我们选择。

Star⭐:9.6k

本周Star⭐️:758

Github地址:https://github.com/withastro/astro

5. Next.js

Next.js 是一个用于服务器渲染的通用 JavaScript Web 应用程序的小型框架,该框架基于React、Webpack 和 Babel 构建,为该网站提供了强大的支持。

Star⭐:79.7k

本周Star⭐️:468

Github地址:https://github.com/vercel/next.js

工具推荐

下面来推荐几个实用的Chrome浏览器扩展。

1. JSONVue

JSONVue 是一个JSON数据查看器,主要用来格式化JSON数据:

安装地址:https://chrome.google.com/webstore/detail/jsonvue/chklaanhfefbnpoihckbnefhakgolnmc

2. Library Sniffer

Library Sniffer 是一款给开发者使用的工具,能够探测当前网页所使用的类库、框架和服务器环境,为开发者提供了方便。比如在CSDN中点击这个插件,可以看到:

安装地址:https://chrome.google.com/webstore/detail/library-sniffer/fhhdlnnepfjhlhilgmeepgkhjmhhhjkh/related

3. WhatFont

当我们想查看网页中文字的字体时,最常用的方法就是在控制台查看文字的字体样式。那还有没有更简单的方法呢?WhatFont就是一个款查看网页字体的Chrome扩展。只需要的点击扩展图标,再点需要查看为文字即可:

安装地址:https://chrome.google.com/webstore/detail/whatfont/jabopobgcpjmedljpbcaablpmlmfcogm

4. ColorZilla

ColorZilla 是一款功能强大的提取网页色彩的工具;也是个快速的对颜色进行调节的Chrome插件,许多的用户将这款软件称呼为颜色吸取插件,它提取的颜色是非常的多样化,还可生产css颜色的代码等。

  • 吸管器-获取页面上任何像素或区域的颜色;
  • 一个先进的颜色选择器类似于可以在Photoshop和Paint Shop Pro中找到的;
  • 网页颜色分析器-分析任何网页上的DOM元素颜色,找到相应的元素;
  • 终极CSS梯度发生器;
  • 调色板查看器与7预先安装调色板;
  • 颜色历史最近挑选的颜色;
  • 显示标签名称,类别,编号,大小等元素信息;
  • 光标下的轮廓元素;
  • 自动将生成或采样的颜色复制到CSS RGB,Hex和其他格式的剪贴板;
  • 使用键盘快速采样页面颜色的键盘快捷键。

安装地址:https://chrome.google.com/webstore/detail/colorzilla/bhlhnicpbhignbdhedgjhgdocnmhomnp/related

5. Toby

Toby 是一款 Chrome 新标签页工具,能够将未读的标签页分组显示在新标签页中,这样就能把所有未看完的标签页都关闭了。分组相当于多个 Chrome 窗口,将你的标签页都拖进 Toby 中,就不需要实时开着占地方了。个人感觉这个插件非常实用,推荐大家都试试~

安装地址:https://chrome.google.com/webstore/detail/toby-for-chrome/hddnkoipeenegfoeaoibdmnaalmgkpip

6. GoFullPage

GoFullPage 是一款全屏截图插件(整个网页截图),完整捕获您当前页面的屏幕,进行滚动截图,而无需任何额外的权限!截取当前浏览器窗口的全屏截图的最简单方法。单击扩展程序图标,然后将其传输到屏幕快照的新标签页中,可以在其中将其下载为图像或PDF,甚至只需拖动即可,保存到桌面。

安装地址:https://chrome.google.com/webstore/detail/gofullpage-full-page-scre/fdpohaocaechififmbbbbbknoalclacl

文章推荐

最后一部分来推荐最近写的几篇原创文章。

1. JavaScript 对象不变性知多少?

本文主要介绍了JavaScript不变性的概念以及实现不变性的几个方法。


2. JavaScript 解构赋值实用指南

本文主要介绍了JavaScript中解构赋值的概念以及一些使用技巧。


3. 28道 LeetCode 题解带你看看链表的那些套路

前端面试中,无论是校招还是社招,现在很多公司都会考察LeetCode题目,本文介绍了链表的相关概念以及通过28道LeetCode题目来看看链表的那些考察套路。


4. 强烈推荐33个 GitHub 前端学习资源

本文列举了三十多个Github上比较热门的前端学习资源,收藏从未停止~


5. 详解 TypeScript 函数声明和重载

本文主要介绍了TypeScript中函数类型的定义以及函数重载的概念和实现。

您可能也对以下帖子感兴趣

文章有问题?点此查看未经处理的缓存