写点什么

前端周报:Vue 3 公开代码库;NPM 发布 6.12.0;Sass 推出模块系统

  • 2019-10-14
  • 本文字数:3024 字

    阅读完需:约 10 分钟

前端周报:Vue 3公开代码库;NPM发布6.12.0;Sass推出模块系统

前端周报专注大前端领域内容,以对外文资料的搜集为主,帮助开发者了解一周前端热点,分为新闻热点、深度阅读、开源项目 & 工具等栏目。欢迎关注【前端之巅】微信公众号(ID: frontshow),及时获取前端周报内容。

新闻热点

前端新闻

Vue 3.0 代码仓库公开

Vue 3.0 完全由 TypeScript 编写,目前还处于 alpha 阶段,仓库地址:


https://github.com/vuejs/vue-next


Vue 3 计划于 2020 年第一季度发布,Vue 3 将更小、更快、更易于维护。其重要变化之一是,受 React Hooks 的启发,新的 API 将允许使用基于函数的方式编写组件。用户可以将逻辑封装到“组合函数”中,并在组件之间重用该逻辑。新的 API 与当前语法 100%兼容,并且不会在短期内被弃用。

NPM 发布 6.12.0

现在,npm ci 针对 git 依赖关系运行准备脚本,修复 --no-optional 参数。engine 不匹配将再次显示的警告。

Firefox Preview Nightly 在 Android 和 Pixel 2 中 启用了 WebRender

Mozilla 的 WebRender 技术首次进入 Android。对于 Google Pixel 2 上的 Firefox Preview(Fenix)用户,最近在默认情况下启用了 WebRender。


WebRender 与 Firefox 57 中引入的 Stylo CSS 引擎一样,也来自 Mozilla 的下一代引擎 Servo,并以 Rust 编程语言编写。WebRender 是网页内容的渲染器,其工作方式更像游戏引擎,但针对网页内容渲染进行了优化,因此具有巨大的性能优势。

行业新闻

消息称 TeamViewer 系统后台被黑客组织 APT41 攻破

10 月 11 日,网上流传疑似深圳市网络与信息安全信息通报中心发出紧急通告,指出目前知名远程办公工具 TeamViewer 已经被境外黑客组织 APT41 攻破,提醒企业组织做好防护措施。


通报中心建议各单位采取以下主动防御措施:


  • 近期停止使用 TeamViewer 软件。

  • 在防火墙中禁止用于 TeamViewer 远程通讯端口 5938。

  • 通过 Web 应用防火墙或其它设备禁止单位内主机回连 teamviewer.com 域名。

使用人工神经网络和人工蜂群优化进行语音识别

印度圣雄甘地特派团工程技术学院和杰比信息技术学院的研究人员开发出一种语音识别系统,研究人员在一系列人类语音音频片段上测试了他们的系统,并将其与传统的语音识别技术进行了比较。他们的技术优于其他所有方法,获得了显著的准确性得分。


研究人员开发的系统的独特之处在于使用了 OABC 优化算法来优化 ANN 的层和人工神经元。人工蜂群(ABC)算法旨在模拟蜜蜂的行为,以解决各种优化问题。研究人员在论文中写道:“该方法的灵敏度、特异性和准确性分别为 90.41%、99.66%和 99.36%,比所有现有方法都要好。”将来,语音识别系统可用于在各种环境中实现更有效的人机通信。此外,他们用于开发系统的方法可能会启发其他团队设计类似的模型。

在恐怖活动发生之前进行预测

数据科学家已经开发了一种预警模型,该模型可以基于前 10 次攻击,预测出恐怖组织在未来的致命程度。该模型利用了全球恐怖数据库(GTD)和 RAND 全球恐怖主义事件数据库(RDWTI)公开获得的数据。

深度阅读

介绍 Sass 的模块系统

Sass 模块系统是解决命名冲突的更强大的方案,新增 @use 和 @forward 规则,而 @import 将被 Sass 逐渐放弃。


https://css-tricks.com/introducing-sass-modules/

理解 JavaScript 中的 This, Bind, Call 和 Apply

在本文中,您将了解 this 根据上下文的隐式指向,您将学习如何使用 bind,call 和 apply 方法,明确指定的值 this。


https://www.digitalocean.com/community/conceptual_articles/understanding-this-bind-call-and-apply-in-javascript

实用的 css 自定义属性模式

本文作者一直在使用 CSS Custom Properties 来发现它们的价值,因为浏览器终于支持开发人员在生产中使用它们了。它们是如此有用和强大!


作者将 CSS 变量的用法归类。当然,开发人员可以随意使用 CSS 变量,但是在不同类别中考虑它们可能会帮助您理解使用变量的不同方式。


  • 变量:基础知识。例如设置,在 color 任何需要的地方使用的品牌。

  • 默认值:例如,默认值 border-radius 可以在以后覆盖。

  • 层级覆盖:例如主题样式覆盖。

  • 范围规则集:各个元素的有意变化。例如链接和按钮。

  • Mixins:规则集旨在将其价值带入新的环境。

  • 内联属性:从 HTML 中的内联样式传递的值。


https://css-tricks.com/patterns-for-practical-css-custom-properties-use/

Chrome 78 有哪些更新?

稳定版的 Chrome 78 将在 10 月 22 日发布,普通用户几乎感觉不到变化,但对于开发者而言,会有一些令人兴奋的新功能。


CSS 透明度百分比


opacity 属性当前接受介于 0(完全透明)和 1(完全不透明)之间的值。Chrome 78 还允许百分比从 0%到 100%:


/* identical styles */.style1 { opactity: 0.75; }.style2 { opacity: 75%; }
复制代码


JavaScript Optional chaining


Optional chaining 是 ES2019 提议,它将节省您数小时的打字和调试工作。


let country = (user && user.address && user.address.country) || undefined;// chrome 78let country = user?.address?.country;
复制代码


恶意行为限制


浏览器窗口卸载事件 unload、beforeunload 以及类似的 pagehide、visibilitychange 技术上这些事件被用于检查数据是否被保存,或记录用户分析数据。不幸的是,一小部分开发者可以用来添加代码破坏用户体验,从 Chrome 78 开始将不允许:


  • 同步的 Ajax 请求 – 可以在 AllowSyncXHRInPageDismissal 策略标志中覆盖此请求,但是该标志还将在版本 82 中删除。

  • 使用 window.open() 创建阻止页面关闭的弹窗。


短信接收器 API


短信文本消息通常用于验证电话号码或发送一次性密码,新的 SMS Receiver API 允许 Web 应用程序使用特定的格式约定读取发送给他们的 SMS 消息,以避免手动的用户交互。例如:


if (navigator.sms) {  try {    let { content } = await navigator.sms.receive();    console.log('SMS text:', content);  } catch (e) {    console.log('error', e);  }}
复制代码


本机文件系统 API


本机文件系统 API 允许浏览器直接与用户本地设备上选择的文件进行交互。它可以用于从客户端 JavaScript 编辑照片、视频或文本文档,而无需上载和下载过程。


屏幕枚举 API


屏幕枚举 API 提供有关连接到用户设备的所有显示器的信息。在应用程序可以使用多个监视器的情况下(例如,提供面向公众的幻灯片和演讲者备注显示的演示文稿),这通常会很有用。


媒体元素 seekto 事件


Chrome 78 引入了一个新的 seekto 动作处理程序,当将播放移至时间轴上的特定点时会调用该处理程序。这可用于进行 DOM 更改,记录分析等。


WebSocketStream


WebSocket 消息到达的速度比浏览器所能应付的更快。在这种情况下,内存缓冲区可能溢出,或者 CPU 使用率将增加到浏览器无响应的程度。


WebSocketStream 取代 WebSocket API。它是基于 promise 的,并且集成了流,因此可以在接收到完整消息之前解析大量数据。


更多关于 Chrome 78 的更新


请访问相关网址查看。


https://developers.google.com/web/updates/2019/09/devtools

工具 & 库 & 资源

【Pokemon Friends】皮卡丘和妙蛙种子,通过 css(scss) 和 html 实现。


https://codepen.io/acupoftee/pen/YzzzYxj


【Parcel-app】parcel 版的 create-react-app。


https://parcelapp.netlify.com/


【moveable】movable 是可拖动、可调整大小、可缩放、可旋转、可扭曲、可捏、可分组、可捕捉的。


https://github.com/daybrush/moveable


【interview_internal_reference】2019 年阿里、腾讯、百度、美团、头条等技术面试题目及答案最新总结,专家出题人分析汇总。


https://github.com/0voice/interview_internal_reference


2019-10-14 15:522547

评论

发布
暂无评论
发现更多内容

极客时间架构实战营作业一

jjn0703

架构实战营

docker入门:elk环境安装记录

小鲍侃java

8月日更

多看了几套房

escray

生活记录 8月日更

MySQL远程连接

一个大红包

8月日更

模块一作业

Geek_fc100d

「架构实战营」

判断是否为数组的 JavaScript 方法总结

编程三昧

JavaScript 数组 8月日更

Go Channel实例剖析

非晓为骁

源码 channel Go 语言 实例分析

WEB常用HTML颜色代码表

入门小站

工具

百度地图开发-搭建基础脚手架 01

Andy阿辉

android Android Studio 8月日更

Windows Server 内存高排查

耳东@Erdong

windows 内存 Windows Server 8月日更 rammap

Battle:你会TLAB,我会逃逸分析

阿Q说代码

逃逸分析 8月日更 栈上分配 同步省略 标量替换

在openGauss上做开发?这个大赛拿出30万寻找开源的你

华为云开发者联盟

数据库 开源 信创 opengauss 鲲鹏

自适应负载均衡算法原理与实现

万俊峰Kevin

负载均衡 微服务 负载均衡算法 Go 语言

sql task03 复杂一点的查询

橙橙橙橙汁丶

统计机器学习导论(一)

Databri_AI

机器学习 统计

container 包详解

Rayjun

Go 语言

儿子教会我的态度

箭上有毒

8月日更

数字人民币弯道超车领先世界,采用独创设计彻底根治区块链顽疾

CECBC

微信业务架构图 & 学生管理系统

I see you

Linux之yum命令

入门小站

Linux

摸鱼小技巧之IDEA调试篇一~

4ye

Java debug 后端 IDEA 8月日更

springBoot中redis的自动装配

Rubble

8月日更

Go- if-else结构

HelloBug

if Go 语言 else

英国“蓝色”氢气计划因碳足迹高遭受重击

CECBC

区块链技术在溯源服务中的应用思考

CECBC

手撸二叉树之另一棵树的子树

HelloWorld杰少

数据结构与算法 8月日更

通过 UIView 和 UIControl 实现的蒙层,哪种更简单?

fuyoufang

swift iOS 知识体系 8月日更

遇见低码:在价值中审视

华为云开发者联盟

ide 低代码 应用 开发语言 低成本

apipost--接口流程化测试

与风逐梦

软件测试 接口测试 软件自动化测试

如何构建 Spring Boot 12 因素应用

码语者

Sprint Boot

醒酒菜:动画图解核心内存区--堆

阿Q说代码

GC 堆内存 8月日更 堆区分代 图解对象分配过程

前端周报:Vue 3公开代码库;NPM发布6.12.0;Sass推出模块系统_大前端_Zehao_InfoQ精选文章