蒲公英 · JELLY技术周刊 Vol.28: Next.js 10 发布
蒲公英 · JELLY技术周刊 Vol.28
前端应用到底该选 SSR 还是 CSR?每个项目技术栈决策的时候都会根据实际需求有自己的看法,而在不久前 React 17 发布之后,自然而然也会有同学好奇,如果想要在服务端渲染 React 17 写的页面有什么比较好的方案么?这不就 Next.js 10 刚好就在十月的小尾巴上发布了,当然除了支持 React 17 以外,Next.js 10 还有更多好用的功能,一起来看看吧~
登高远眺
天高地迥,觉宇宙之无穷
基础技术
在项目中实践 CLS 性能指标优化
你是否试过在开始阅读一篇有趣的新闻文章時,因为所有文字突然向下移动而令你要重新找回刚才看到的部分?Chorme 83 中新增了 Cumulative Layout Shift(CLS) 指标来衡量页面「累计版面配置转移」的数值,本文将在项目中实践 CLS 指标的优化。
前端框架
Next.js 10 正式发布:带来诸多新特性
10月27号 Next.js conf 大会上发布了全新的版本-Next.js 10,本次发布的特性主要聚焦于开发者体验的提升和用户体验的提升,还包含了诸多亮点:内置图片组件Image Component : next/image
,自动进行图片优化;国际化路由Internationalized Routing
,多语言支持,自动语言检测等,一起来快速了解下吧~
工程化
腾讯 Code Review 规范
代码,是设计理念落地的地方,是技术的呈现和根本。同学们可以在 review 过程中做到落地沟通,不再是空对空的讨论,可以在实际问题中产生思考的碰撞,互相学习,大家都掌握团队里积累出来最好的实践方式!
图形编程
使用贝塞尔样条算法生成穿过预定义点的平滑曲线
在设计师作图时, 通常会先定义若干点, 然后生成一条穿过这些点的平滑曲线, 再进行细节刻画。这种根据预定义点生成平滑曲线的算法叫做贝塞尔样条算法, 它还应用在很多的场景, 比如数据可视化中的曲线图、数值分析中曲线拟合和手绘软件中画笔的线条等。
服务端开发
TiDB一款同时支持在线事务处理与在线分析处理的融合型分布式数据库产品
TiDB 是 PingCAP 公司自主设计、研发的开源分布式关系型数据库,是一款同时支持在线事务处理与在线分析处理 (Hybrid Transactional and Analytical Processing, HTAP)的融合型分布式数据库产品,具备水平扩容或者缩容、金融级高可用、实时 HTAP、云原生的分布式数据库、兼容 MySQL 5.7 协议和 MySQL 生态等重要特性。目标是为用户提供一站式 OLTP (Online Transactional Processing)、OLAP (Online Analytical Processing)、HTAP 解决方案。TiDB 适合高可用、强一致要求较高、数据规模较大等各种应用场景
人工智能
GPT-3 袭来,前端又要失业?谈谈如何实现智能切图
曾经,智能切图项目 pix2code 横空出世,它支持导入设计稿直接生成代码,惊艳了整个前端届,就在大家惊呼前端要失业的时候,这个项目却完美演绎了出道即巅峰,从此再无更新,渐渐被人遗忘。最近 GTP-3 再一次挑战前端,似乎前端这个领域总是充满危机感。本文由百度 FEX 负责人吴多益撰写,他用强悍的学习能力告诉我们,前端er 无需焦虑,任何新技术的出现都应该成为一个合格工程师手中的利剑,学习它,掌握它,然后用它惊艳所有人。So,keep learning,keep growing!
工具推介
Framer Motion:让动画创建更加简单
framer-motion
是适用于react
的动效库,通过将动作添加到HTML和SVG元素前面来创建动画组件,无需成为CSS专家即可创建精美的动画。本文介绍了其基本的使用方式。
沧海拾遗
沧海拾遗,积跬步以至千里
随机算法: 2D 圆形分布
前端有什么算法?前端工程师不需要懂算法?或许很多人都有类似这样的误区,觉得前端开发过程中需要用到算法的场景很少,而这篇文章恰恰就写到了随机算法在前端场景下的应用方式。
平面下的物理引擎——Matter.js 的试玩报告
模拟一个接近真实的环境,那么我们很多时候需要去实现一整套系统的算法去描述所有的物理规则,或者我们可以使用某一个引擎来帮助我们完成这些,而在 Web 端的平面世界中就有 Matter.js 这样一个刚体物理学引擎可以实现我们绝大多数的需求。
「蒲公英」期刊,每周更新,我们专注于挖掘「基础技术、工程化、跨端框架技术、图形编程、服务端开发、桌面开发、人工智能、设计哲学、前端框架」等多个大方向的业界热点,并加以专业的解读;不仅如此,我们还会推介精选凹凸技术文章,向大家呈现团队内的研究技术方向。
抬头仰望,蒲公英的种子会生根发芽,如夏花绚烂;格物致知,我们登高远眺、沧海拾遗,以求积硅步而至千里。
欢迎关注凹凸实验室博客:aotu.io
或者关注凹凸实验室公众号(AOTULabs),不定时推送文章:
蒲公英 · JELLY技术周刊 Vol.28: Next.js 10 发布的更多相关文章
- 蒲公英 · JELLY技术周刊 Vol.30: 此路不通?Vue 3 新提案 Ref-sugar
蒲公英 · JELLY技术周刊 Vol.30 随着 Vue 3 发布,相关的新闻也逐渐火热起来,而近期 RFC 中两个新的提案也因为某乎上的一些事情变得广为人关注.Ref sugar和script s ...
- 蒲公英 · JELLY技术周刊 Vol.03
蒲公英 · JELLY技术周刊 Vol.03 「蒲公英」期刊全新升级--JELLY技术周刊!深度挖掘业界热点动态,来自团队大咖的专业点评,带你深入了解团队研究的技术方向. 登高远眺 天高地迥,觉宇宙之 ...
- 蒲公英 · JELLY技术周刊 Vol.16 谷歌首个线上 Web 开发者大会
蒲公英 · JELLY技术周刊 Vol.16 近期,谷歌有史以来的第一次线上谷歌 Web 开发者大会,Web Vitals.PWA.DevTools 和 Lighthouse 6.0 等一系列特性或产 ...
- 蒲公英 · JELLY技术周刊 Vol.17: 90 行代码实现 React Hooks
蒲公英 · JELLY技术周刊 Vol.17 React Hooks 相信大家都不陌生,自被设计出以来就备受好评,在很多场景中都有极高的使用率,其中原理更是很多大厂面试中的必考题,很多朋友都能够如数家 ...
- 蒲公英 · JELLY技术周刊 Vol.22: npm i react-router@6.0.0-beta.0
蒲公英 · JELLY技术周刊 Vol.22 近期 React Router 已经释出了 6.x 的 beta 版本,正式版本已经不远了,作为 React 生态中的重要组成部分,React Route ...
- 蒲公英 · JELLY技术周刊 Vol.25 · Webpack 5 正式发布,你学废了么
蒲公英 · JELLY技术周刊 Vol.25 阔别两年,Webpack 5 正式发布了,不仅清理掉很多冗余的功能,同样也为我们带来了很多新鲜的能力,不论是默认开启的持久缓存,还是反病毒保护,亦或者被其 ...
- 蒲公英 · JELLY技术周刊 Vol 27: 平平无奇 React 17
蒲公英 · JELLY技术周刊 Vol.27 这个热闹的十月终于要走到尾声,React 17 历经 4 个 RC 版本之后,也于数天前正式发布了,而同在几天前发布的 CRA 4.0 也已经完成了 Re ...
- 蒲公英 · JELLY技术周刊 Vol.19 从零开始的 Cloud IDE 开发
蒲公英 · JELLY技术周刊 Vol.19 你是否也会有想法去开发一个自己的 IDE 却苦于时间和精力不足,完成 Desktop IDE 却又被 Cloud IDE 的概念追在身后难以入睡,这样的两 ...
- 蒲公英 · JELLY技术周刊 Vol.20: Vue3 极致优化——分析 Vue3 Compiler 告诉你为什么这么快
蒲公英 · JELLY技术周刊 Vol.20 性能优化是一条无尽的路,我们总是可以找到各种途径去提升体验,不论是响应时间还是按需加载,亦或是根据框架或者组件有针对性的优化都会是不错的方法.如果你在使用 ...
随机推荐
- ByPass Mode(略过模式或旁路模式)
参考: 1. https://baike.baidu.com/item/%E6%97%81%E8%B7%AF%E6%A8%A1%E5%BC%8F/3120563 2. https://zhidao.b ...
- 发现3 .js与Android和英特尔XDK
下载example3.zip - 456.5 KB 下载apk14.zip - 6.8 MB 下载apk13.zip - 6.8 MB Introduction 本文是关于使用Intel XDK和t ...
- 用python处理excel文件有多轻松?工作从未如此简单
最近需要频繁读写 excel 文件,想通过程序对 excel 文件进行自动化处理,发现使用 python 的 openpyxl 库进行 excel 文件读写实在太方便了,结构清晰,操作简单.本文对 o ...
- npm npx cnpm yarn 的区别
npm npm 是 Node.js 官方提供的包管理工具.用于 Node.js 包的发布.传播.依赖控制.npm 提供了命令行工具,使你可以方便地下载.安装.升级.删除包,也可以让你作为开发者发布并维 ...
- 多测师讲解_ 高级自动化测试selenium_001基本学习
高级自动化测试python+selenium教程手册 --高级讲师肖sir 第 1 章webdriver 环境搭建好了,我们正式学习 selenium 的 webdriver 框架,它不像 QTP 之 ...
- MeteoInfoLab脚本示例:多Y轴图
数据范围相差比较大的数据序列进行对比的时候多Y轴图就很重要了.MeteoInfoLab中提供了一个twinx函数来根据已有的坐标系(Axes)生成一个新的Axes,这个命令会使得已有的Axes不绘制右 ...
- ES异常处理-NoNodeAvailableException
1.问题描述 ES client客户端能创建,但是在用客户端操作时报:NoNodeAvailableException[None of the configured nodes are availab ...
- python去除特殊字符
去除数字,特殊字符,只保留汉字 ? 1 2 3 4 5 6 7 8 import re s = '1123*#$ 中abc国' str = re.sub('[a-zA-Z0-9'!"# ...
- SonarQube 7.7 安装教程
SonarQube 7.7 安装教程 一. CentOS设置 1. 更换阿里源 curl -o /etc/yum.repos.d/CentOS-Base.repo http://mirrors.ali ...
- document.all.WebBrowser为空或不是对象
项目中也想用这个功能,发现出错,经过测试,一定要加<object id="WebBrowser" width=0 height=0 classid="CLSID:8 ...