关于javascript:山月周刊第6期React-学习路线图

前端爱好者周刊 (Github: shfshanyue/weekly)，每周记录对于前端的开源工具、优良文章、重大库版本公布记录等等。每周一公布，订阅平台如下，欢送订阅。

• 订阅网站: https://weekly.shanyue.tech
• 订阅 Github: shfshanyue/weekly

封面

蕴含了从高级到高级无关 React 生态的学习路线图，图片出自 roadmap.sh

一句话

• 在 Chrome 中关上开发者总局，<Ctrl+Shift+P> 搜寻 Full Size，可 截屏网页滚动长页面
• Deno & Node.js 作者 Ryan Dahl 和联结创始人 Bert Belder 发表成立了 Deno 公司
• vue3 将不再反对 IE11，原定投入 Vue 3 IE11 反对的精力将投入给 2.7
• 最新数据显示，截至 2021 年 2 月底，我国公募基金治理规模达到 21.78 万亿元

开发利器

一、Svg Viewer

可视化 SVG，并反对压缩图片、转化为 React/RN 组件、转化为 png 格局的图片等

二、URL-encoder for SVG

把 SVG 转化为 DataURI，并嵌入到 CSS 款式中

文章举荐

一、图片加载异样兜底计划

当图片加载失败后，咱们能够应用 DataURI 作为一个敌对的兜底计划。然而仍有许多简单的状况，能够看这篇文章理解一下。

代码片段

一、如何把一个数组随机打乱?

应用原生实现，Math.rondom() – 0.5 有时大于 0，有时小于 0 会达成这样的成果

[1, 2, 3, 4].sort((x, y) => Math.random() - 0.5)

借用 lodash 可更不便

_.shuffle([1, 2, 3, 4])
//-> 

开源与库

一、tippy: 最好用的 tooltip 工具

一个 tooltip 工具，可在 React 中应用，反对多达几十种丰盛的选项。

• repo: atomiks/tippyjs/
• npm: tippy.js

版本公布

一、Next.js 10.1

We are excited to introduce Next.js 10.1, featuring:

• 3x Faster Refresh: 200ms faster refresh with no changes necessary.
• Improved Installation Time: 58% smaller install size and 56% fewer dependencies.
• next/image Improvements: Apple Silicon (M1) Support, plus more layout and loader options.
• Next.js Commerce Shopify Integration: Flexible data layer for composable e-commerce apps.
• Custom 500 Page: Add your own logo and branding to error pages.
• Strict PostCSS Configuration Loading: Improved caching with Webpack 5.
• Support for extends in tsconfig.json: Extensible configuration for large TypeScript apps.
• Detect When Preview Mode Is Enabled: Conditionally show content when viewing previews.
• Router Methods Scroll to Top: Automatically scroll to the top, now consistent for all routing.
• Documentation Improvements: Incremental adoption, migration, and Docker deployment.

二、Node v15.13.0

在 Node 中也反对了 btoa 与 atob 了

• buffer:

  • implement btoa and atob (James M Snell) #37529

• deps:

  • upgrade npm to 7.7.6 (Ruy Adorno) #37968

    • This update adds workspaces support to npm run and npm exec

• doc:

  • add legacy status to stability index (James M Snell) #37784
  • add @linkgoron to collaborators (Nitzan Uziely) #37817

• http:

  • add http.ClientRequest.getRawHeaderNames() (simov) #37660

三、npm v7.8.0

次要集中在对 workspaces 反对的加强

FEATURES

• 8bcc5d73f #2972 feat(workspaces): add repo and docs (@wraithgar)
• ec520ce32 #2998 feat(set-script): implement workspaces
• 32717a60e #3001 feat(view): add workspace support (@wraithgar)
• 7b177e43f #3014 feat(config): add ‘envExport’ flag (@isaacs)

BUG FIXES

• 4c4252348 #3016 fix(usage): specify the key each time for multiples (@isaacs)
• 9237d375b #3013 fix(docs): add workspaces configuration (@wraithgar)
• cb6eb0d20 #3015 fix(ERESOLVE): better errors when current is missing (@isaacs)