前端每周清单:Next.js 2.0 发布,Vue.js 2.2 完整API 手册,Safari 10.1 新增系列重要特性

文带链接版请移步:https://zhuanlan.zhihu.com/p/26189426

新闻热点

国内国外,前端最新动态
《Safari 10.1 发布,新增众多重要 Web 特性》:近日随着 iOS 10.3 与 macOS Sierra 10.12.4 的版本发布,系统内置的Safari 10.1 增加了许多重要的 Web 特性支持与性能提升,包括 CSS Grid 布局、fetch、IndexDB 2.0、Custom Elements、Form Validation、Media Capture 等等。( New Web Features in Safari 10.1 )
《Next.js 2.0 发布》:近日 Next 2.0 正式发布,它为我们提供了便捷的快速开发 React 服务端渲染的工具,使得开发者能够专注于业务开发。在 2.0 版本中它提供了自定义路由、自定义服务端渲染代码、组件内 CSS、Prefetching 等等多个新特性。( ZEIT – Next.js 2.0
《echarts v3.5 发布:新增日历坐标系、坐标轴指示器;同时统计扩展 v1.0 发布》:在 echarts 新发布的 3.5 版本中,新增了日历坐标系,增强了坐标轴指示器。同时,echarts 统计扩展 1.0 版本发布了。日历坐标系用于在日历中绘制图表,坐标轴指示器方便用户观察数据内容,统计扩展是一个专门用来进行数据分析的工具。( echarts v3.5 发布:新增日历坐标系、坐标轴指示器;同时统计扩展 v1.0 发布
《Relay 1.0.0 发布》:近日 Relay 1.0.0-alpha 发布,提供了许多新的特性。作为 Facebook 发布的全特性 GraphQL 客户端,其能够在低配的移动设备上构建高性能、复杂可扩展的应用。( twitter.com/leeb/status )

开发教程

步步为营,掌握基础技能

工程实践

立足实践,提示实际水平

深度阅读

深度思考,升华开发智慧

  • 《深入浅出构建简单的 Chess AI》:本文作者介绍了如何基于 JavaScript 构建一个国际象棋的 AI,虽然不属于前端开发范畴,不过还是蛮有意思的一篇文章。本文主要包括移动生成、棋盘可视化、位置评估、基于 Minimax 算法的搜索树、Alpha-beta 修剪等等。( parg.co/bCw )
  • 《构建高性能扩展与折叠动画》:本文以菜单伸缩动画为例,介绍如何构建高性能扩展与折叠动画。较简单但是性能有缺陷的方式譬如修改元素宽高或者使用 clip 变换属性;而本文主要是由 CSS3 的 scale 变换来实现菜单的扩展与折叠,其为了保证菜单按钮的视觉效果与整体的平滑缩放还使用了所谓的对冲缩放技巧。( parg.co/bCz )
  • 《基于 ReactNaive 与 Uber 工程基础构建 UberEATS》:本文是 UberEATS 的工程师团队介绍的他们基于 Uber 原工程架构与 ReactNative 实现应用的工程实践;包括了构建迁移路径、应用架构定义、自动更新、测试与静态类型检测等等。( Powering UberEATS with React Native and Uber Engineering )
  • 《利用机器学习优化网站性能》:本文是从浅显机器学习的角度来考虑如何优化网站性能,可能从专业服务端机器学习的角度来看并不复杂,但是从前端网站构建的角度来看也是蛮有意思的。本文包括了记录网站点击与提交信息、利用 AWS S3 进行模型训练、利用 UI 进行可视化展示等等。( parg.co/bhQ
  • 《Chrome 中 Preload、Prefetch 以及 优先级介绍》:本文是 Google Chrome 团队的 Addy Osmani 对 Chrome 中的 Preload、Prefetch 以及抓取优先级的介绍,并且介绍了在网站性能优化中对于 Preload 与 Prefetch 的使用技巧和 HTTP/2 带来的服务端推送如何协同使用等内容。( parg.co/bhM )

开源项目

乐于分享,共推前端发展
《jsinspect》:jsinspect 提供了方便的命令行工具或者构建插件来检测代码库中的复制粘贴或者结构相似的代码片,以方便开发者在优化过程中完成代码的重构。( danielstjules/jsinspect )
《Reactide》:Reactide 是首个面向 React Web 应用开发 IDE,其基于 Electron 提供了跨平台的特性。Reactide 允许我们像传统开发那样打开单个文件就可以完成预览,并且提供了便捷的组件导入、格式化等功能。该项目仍处于积极的开发中,可以拭目以待。 ( reactide/reactide )
《marky》:marky 是基于 performance.mark/measure 封装的高性能 JavaScript 计时器,其相较于console.time()以及console.timeEnd()具有更好地性能表现,相较于简单的Date.now()具有更好地准确度。( nolanlawson/marky )
《Service Worker Mock》:在 PWA 应用的开发中对于 Service Worker 的测试一直比较麻烦,每个文件都可能通过self.addEventListener产生副作用,并且 Service Worker 的运行环境也迥异于正常的 Web 或者 Node 环境。而本包则是通过注入伪造的 Service Worker 环境来方便测试。( pinterest/service-workers )
《Public JSON APIs》:本仓库列举了许多 Web 开发中用到的公开的 JSON 接口,包括信息检索、机器学习、工具使用等等多个方面。( toddmotto/public-apis )
《generator-ngx-app》:Angular 4 商业级应用项目生成器,其包括了 angular-cli 提供的现代工具与工作流,以及来自于社区的最佳实践、可扩展的基础模板以及较好地学习曲线。( angular-starter-kit/generator-ngx-app

巅峰人生

  • 《WWW之父Tim Berners-Lee获图灵奖》:美国计算机学会(ACM)宣布将2016年的图灵奖授予万维网(WWW)的发明者Tim Berners-Lee。他将获得由Google赞助的一百万美元奖金。ACM提到他的获奖理由是,“inventing the World Wide Web, the first web browser, and the fundamental protocols and algorithms allowing the web to scale.” 。( WWW之父Tim Berners-Lee获图灵奖)

 

文章来源:前端之巅

作者 :王下邀月熊