写点什么

前端周报: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:522503

评论

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

多项目并行,项目经理如何有效管理项目进度?

万事ONES

研发管理工具 ONES 项目经理 项目管理工具

阿里+头条+腾讯等大厂Android面试题分享,神操作!

欢喜学安卓

android 程序员 面试 移动开发

如何用EasyRecovery找回已经删除的图片?

淋雨

EasyRecovery 文件恢复 硬盘数据恢复

「免费开源」基于Vue和Quasar的前端SPA项目crudapi后台管理系统实战之联合索引(十一)

crudapi

Vue crud crudapi quasar 联合索引

架构实战营 模块七作业

netspecial

架构实战营

小蚂蚁CFT定制系统开发

数据结构——树和二叉树

若尘

数据结构 二叉树

「项目管理100问」之一篇优秀的周报是怎样炼成的?

万事ONES

项目 周报 ONES

如何基于阿里云持久内存实例搭建高性价比Redis应用?

弹性计算百晓生

redis 阿里云 Redis 核心技术与实战 弹性计算

ONES 课堂:敏捷开发和迭代

万事ONES

项目管理 敏捷开发 ONES 迭代

Ant蚂蚁挖矿系统软件开发资料

Go 学习笔记之 命名

架构精进之路

Go 语言 7月日更

云小课 | ModelArts Pro 自然语言处理套件:高效构建行业高精度文本处理模型

华为云开发者联盟

AI nlp ModelArts Pro 开发套件 文本处理模型

流量为王时代的短视频平台如何确保内容质量?|【话题讨论】

老猿Python

技术 内容审核 流量为王 负能量

用 Docker 工具管理 WebAssembly 应用程序

WasmEdge

Docker rust 云原生 webassembly

阿里+头条+抖音+百度+蚂蚁+京东面经,都是精髓!

欢喜学安卓

android 程序员 面试 移动开发

JAVA 设计模式系列——工厂模式

加百利

7月日更

Java零基础学习路线图(2021版)

Java入门到架构

Java 书籍

开发者必看!你想知道的迁移之道都在这里了

华为云开发者联盟

数据库 DRS 数据迁移 GaussDB(for openGauss) 迁移工具

OBC区块链社交软件系统开发内容

GTG天天播软件开发|GTG天天播APP系统开发

对象存储手把手教一 | 用户数据访问控制管理ACL

QingStor分布式存储

云原生 对象存储 分布式存储

华为前端工程师分享:查明网站访问故障原因,教你4招快速应对

华为云开发者联盟

高可用 网站 CDN 云安全 DNS故障

Watt瓦特系统APP开发搭建

Pi network/π币系统APP软件开发搭建

架构实战营模块七总结

竹林七贤

SSC公链系统软件开发内容

阿里云ECS Cloudbuild开发者大赛重磅开启!40万奖金燃爆这个夏天!

弹性计算百晓生

云计算 阿里云 开发者大赛

从零开始学习3D可视化之事件卸载、事件暂停

ThingJS数字孪生引擎

大前端 3D可视化 数字孪生 事件

Grpc对象转proto代码工具

Spook

gRPC proto

Bee Network蜂币系统APP开发简介

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