# 蒲公英 · JELLY技術週刊 Vol.28 > 前端應用到底該選 SSR 還是 CSR？每個專案技術棧決策的時候都會根據實際需求有自己的看法，而在不久前 React 17 釋出之後，自然而然也會有同學好奇，如果想要在服務端渲染 React 17 寫的頁面有什麼比較好的方案麼？這不就 Next.js 10 剛好就在十月的小尾巴上釋出了，當然除了支援 React 17 以外，Next.js 10 還有更多好用的功能，一起來看看吧～ ## 登高遠眺 > 天高地迥，覺宇宙之無窮 ### 基礎技術 #### [在專案中實踐 CLS 效能指標優化](http://3.cn/1-00uamwG) 你是否試過在開始閱讀一篇有趣的新聞文章時，因為所有文字突然向下移動而令你要重新找回剛才看到的部分？Chorme 83 中新增了 Cumulative Layout Shift（CLS) 指標來衡量頁面「累計版面配置轉移」的數值，本文將在專案中實踐 CLS 指標的優化。 ### 前端框架 #### [Next.js 10 正式釋出：帶來諸多新特性](http://3.cn/100-ua4Yc) 10月27號 Next.js conf 大會上釋出了全新的版本-Next.js 10，本次釋出的特性主要聚焦於開發者體驗的提升和使用者體驗的提升，還包含了諸多亮點：內建圖片元件`Image Component : next/image`，自動進行圖片優化；國際化路由`Internationalized Routing`，多語言支援，自動語言檢測等，一起來快速瞭解下吧~ ### 工程化 #### [騰訊 Code Review 規範](http://3.cn/10-0ualFs) 程式碼，是設計理念落地的地方，是技術的呈現和根本。同學們可以在 review 過程中做到落地溝通，不再是空對空的討論，可以在實際問題中產生思考的碰撞，互相學習，大家都掌握團隊裡積累出來最好的實踐方式！ ### 圖形程式設計 #### [使用貝塞爾樣條演算法生成穿過預定義點的平滑曲線](http://3.cn/100-uan0m) 在設計師作圖時, 通常會先定義若干點, 然後生成一條穿過這些點的平滑曲線, 再進行細節刻畫。這種根據預定義點生成平滑曲線的演算法叫做貝塞爾樣條演算法, 它還應用在很多的場景, 比如資料視覺化中的曲線圖、數值分析中曲線擬合和手繪軟體中畫筆的線條等。 ### 服務端開發 #### [TiDB一款同時支援線上事務處理與線上分析處理的融合型分散式資料庫產品](http://3.cn/100uamb-H) 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 襲來，前端又要失業？談談如何實現智慧切圖](http://3.cn/10-0uambI) 曾經，智慧切圖專案 [pix2code](https://github.com/tonybeltramelli/pix2code) 橫空出世，它支援匯入設計稿直接生成程式碼，驚豔了整個前端屆，就在大家驚呼前端要失業的時候，這個專案卻完美演繹了出道即巔峰，從此再無更新，漸漸被人遺忘。最近 GTP-3 再一次挑戰前端，似乎前端這個領域總是充滿危機感。本文由百度 FEX 負責人吳多益撰寫，他用強悍的學習能力告訴我們，前端er 無需焦慮，任何新技術的出現都應該成為一個合格工程師手中的利劍，學習它，掌握它，然後用它驚豔所有人。So,keep learning,keep growing! ### 工具推介 #### [Framer Motion：讓動畫建立更加簡單](http://3.cn/-100uan0l) `framer-motion`是適用於`react`的動效庫，通過將動作新增到HTML和SVG元素前面來建立動畫元件，無需成為CSS專家即可建立精美的動畫。本文介紹了其基本的使用方式。 ## 滄海拾遺 > 滄海拾遺，積跬步以至千里 #### [隨機演算法: 2D 圓形分佈](http://3.cn/100ualF-t) 前端有什麼演算法？前端工程師不需要懂演算法？或許很多人都有類似這樣的誤區，覺得前端開發過程中需要用到演算法的場景很少，而這篇文章恰恰就寫到了隨機演算法在前端場景下的應用方式。 #### [平面下的物理引擎——Matter.js 的試玩報告](http://3.cn/-100ualqw) 模擬一個接近真實的環境，那麼我們很多時候需要去實現一整套系統的演算法去描述所有的物理規則，或者我們可以使用某一個引擎來幫助我們完成這些，而在 Web 端的平面世界中就有 Matter.js 這樣一個剛體物理學引擎可以實現我們絕大多數的需求。 > 「蒲公英」期刊，每週更新，我們專注於挖掘「**基礎技術**、**工程化**、**跨端框架技術**、**圖形程式設計**、**服務端開發**、**桌面開發**、**人工智慧**、**設計哲學**、**前端框架**」等多個大方向的業界熱點，並加以專業的解讀；不僅如此，我們還會推介精選凹凸技術文章，向大家呈現團隊內的研究技術方向。 > > 抬頭仰望，蒲公英的種子會生根發芽，如夏花絢爛；格物致知，我們登高遠眺、滄海拾遺，以求積矽步而至千里。 > > [蒲公英 · JELLY技術週刊貢獻指南](http://3.cn/12dbZQ-x)  ------- 歡迎關注凹凸實驗室部落格：[aotu.io](https://aotu.io/) 或者關注凹凸實驗室公眾號（AOTULabs），不定時推送文章： ![歡迎關注凹凸實驗室公眾號](https://img2020.cnblogs.com/other/1992869/202011/1992869-20201104094938648-2082761