伴郎粗大的内捧猛烈进出第一章,羞羞漫画在线观看,亚洲国产一区二区a毛片,友田彩也香番号

全國統(tǒng)一24小時服務咨詢熱線0755-8257993612年專業(yè)網(wǎng)絡服務供應商

行業(yè)資訊

2020 前端技術(shù)發(fā)展回顧

1970-01-01 08:00:00 分享 瀏覽次數(shù):0次

2020 終究是一個不平凡的一年,我們經(jīng)歷了太多坎坷與磨煉。甚至受 COVID-19 疫情的影響,Chrome 瀏覽器罕見的斷更了,Chrome 82 就此缺席。但 Web 生態(tài)依舊保持了欣欣向榮的活力,一大批新特性持續(xù)不斷涌現(xiàn)出來。


標準與協(xié)議

ECMAScript


  • ES2020 如期發(fā)布,此前進入 Stage 4 的提案均被納入正式規(guī)范。

    • import():用于動態(tài)加載模塊;

    • import.meta:一個對象,用來攜帶模塊相關(guān)的元信息;

    • export * as newModule from 'package':一種新的聚合導出語法;

    • 新增可選鏈運算符?. :能夠在屬性訪問、方法調(diào)用前檢查其是否存在;

    • 新增空值合并操作符?? :用來提供默認值,說明上下文是 nullundefined;

    • 新增 BigInt 基礎數(shù)值類型:可以表示絕對值大于 2^53-1 的整數(shù)而無精度損失;

    • 新增 Promise.allSettled():返回一個在所有給定的 Promise 已進入 fullfilled 或 rejected 狀態(tài)的 Promise,并帶有一個對象數(shù)組,每個對象表示對應的 Promise 結(jié)果;

    • 新增 String.prototype.matchAll:一個包含所有匹配正則表達式的結(jié)果及分組捕獲組的迭代器。與 RegExp.prototype.exec 的區(qū)別在于:如果要得到所有匹配項,需要正則表達式有 /g 標志,且多次調(diào)用 .exec() 才會得到所有匹配的結(jié)果,而 matchAll 只需要調(diào)用一次;

    • 新增 globalThis:用來解決瀏覽器、Node.js 等不同環(huán)境下,全局對象名稱不統(tǒng)一,獲取全局對象比較麻煩的問題。


CSS

特性

  • Flexbox 已經(jīng)全面普及,垂直居中不再是前端「打工人」的煩惱絲。雙飛翼、圣杯布局等各種 Hack 的手法也終究淹沒在歷史的長河之中。

  • Flexbox 中也支持了 gap 屬性,可以非常方便的調(diào)節(jié)相鄰元素的間距,主流瀏覽器均已支持;

  • 所有主流瀏覽器都支持了 CSS Grid,同時也被更多人熟知和使用,Subgrid(子網(wǎng)格)在 Firefox 71 中正式發(fā)布。Float、inline-block 不再成為頁面布局首選,CSS 布局正在從一維向二維挺進;

  • 縱橫比屬性 aspect-ratio 已經(jīng)在 Chrome 88 中支持,通過它可以非常方便的實現(xiàn)元素的等比縮放;

  • Firefox 創(chuàng)新性的基于 CSS Grid 實現(xiàn)了瀑布流布局(grid-template-rows: masonry),并推動其進入規(guī)范,這將比 JavaScript 方案擁有更好的性能;

  • 容器查詢(Container Queries)取得了實質(zhì)性進展,Chrome 正在快馬加鞭的實現(xiàn)中。有了它響應式組件如虎添翼,可以根據(jù)容器大小來設置不同的樣式;

  • Chrome 86 和 Firefox 85 支持了 :focus-visible 偽類,可以單獨控制鍵盤的焦點樣式,請停止使用* { outline: none; },改用 :focus:not(:focus-visible) { outline: none; } :focus-visible { outline: auto; },這樣既可以保證鼠標點擊時沒有焦點框,也保留了鍵盤 Tab 鍵操作的時候出現(xiàn)焦點框,使頁面的無障礙性更加友好。


技術(shù)領域

數(shù)據(jù)來自 The State of CSS 2020


  • 處理器:三大預處理器(Sass、Less、Stylus)中,Sass 滿意度最高,其他兩者相對較低,其中很大一部分人轉(zhuǎn)投了后處理器 PostCSS 的陣營。Sass 社區(qū)的 LibSass 宣布已棄用,不再支持新的功能的開發(fā),LibSass 和 node-sass 將在最大努力的基礎上繼續(xù)無限期維護,包括修復主要的錯誤和安全性問題,并保持與最新版本的 Node.js 相兼容;

  • CSS 框架層面:前有 CSS-in-JS 的持續(xù)追擊,后有以「實用原子類」為代表的 Tailwind CSS 異軍突起,迫使我們重新思考 CSS 語義化類名的真諦。傳統(tǒng) CSS 框架中,用戶繼續(xù)使用 Bootstrap 的意愿明顯下降,Pure.CSS 歡迎度不減;

  • CSS-in-JS:CSS Modules 和 Styled Components 繼續(xù)保持在第一陣營;

  • Linter:Stylelint 依然是 Style Lint 領域的領頭羊。Prettier 作為「全能」的格式化工具,支持原生 CSS、 SCSS、Less 三種語法,是開發(fā)者格式化樣式的不二之選,搭配 Git Hooks 使用,妙不可言。


端技術(shù)

WebAPI


  • Chrome 87 開始,可以在 JavaScript 層面控制攝像頭的平移、傾斜和縮放了;

  • Web NFC 在 Chrome 81 開始進入初始試用計劃;

  • Safari 14 已支持 WebP 圖片格式,至此,四大主流瀏覽器(Chrome、Firefox、Edge、Safari)已全部支持 WebP;

  • Safari 14 已支持 Web 端通過 Web Authentication API 調(diào)用 Face ID 和 Touch ID 驗證用戶;

  • 優(yōu)化高 DOM 渲染壓力場景的 Display Locking (展現(xiàn)鎖定)提案再次更新;

  • 下一代圖片格式 AVIF(AV1 Image File Format)已經(jīng)來了,此格式比 JPEG 小 50% 左右、比 WebP 小 20% 左右,相關(guān)性能跑分見此,目前 Chrome 85、Firefox 77 已支持;

  • HTML enterkeyhint 屬性已在 Chrome 77、Safari 13.1 得到支持(Firefox 支持私有的 mozactionhint 屬性),該屬性可以使移動設備鍵盤中的 enter 鍵根據(jù)情景展現(xiàn)為不同的文案和樣式;

  • W3C 沉浸式 Web 工作組發(fā)布 WebXR 手勢輸入模塊 Level 1 規(guī)范 的首個公開工作草案,該模塊具有追蹤關(guān)節(jié)手勢的功能,可用于在 VR 場景中識別手部關(guān)節(jié)姿勢或渲染手勢模型。



安全隱私保護得到完善


2020 年是歐盟通用數(shù)據(jù)保護協(xié)議 GDPR 強制生效的第三年,也是熔斷 Meltdown 與幽靈 Spectre 漏洞發(fā)生的第三年。在 2020 年,各大瀏覽器安全和隱私保護策略得到了很大的進展。


  • 下線有安全隱患的支持:有安全隱患的支持:

    • TLS 1.0 & TLS 1.1 已在 Chrome 84+、Firefox 74+、Safari 13.1+ 中下線:

    • FTP 已在 Safari 14+、Chrome 87+ 中下線,將在 Firefox 將來版本中下線;

    • Flash 已在 Safari 14+ 中下線,將在 Chrome 88+、Firefox 85+ 中下線;

  • 跨站隔離優(yōu)化:

    • 2018 年初,由于 Spectre 漏洞的暴露,高精度定時器和 Shared Memory API 被禁用,為預防相關(guān)漏洞,瀏覽器需要保證不同站點在不同進程,相互隔離;

    • 為了保證跨站進程隔離,Cross-Origin-Opener-PolicyCross-Origin-Embedder-Policy 返回頭被設計出來。當它們被服務端正確返回時,F(xiàn)irefox 79+ 和 Chrome 88+ 對 Shared Memory API 的支持將重新打開;

  • 跨站嗅探預防:

    • 在 Safari 13.1+ 中,第三方 Cookie 完全被禁用,JavaScript 可寫的存儲最多保留一周;

    • 在 Safari 14+ 中,跨域資源的 Cookie 完全被禁用,除非經(jīng)由 Storage Access API 顯式獲取用戶的同意;第三方 CNAME 的域名 Cookie 最多可設置 7 天有效期;

    • 在 Firefox 79+ 中,新版智能跨站嗅探預防(ETP 2.0)上線,將每 24 小時清除被判定為跨站嗅探的相關(guān) Cookie 設置;

  • 緩存粒度優(yōu)化:

    • Chrome 85+,HTTP 緩存采用更細粒度的鍵(ETLD+1);

    • Firefox 將在 85 后實現(xiàn)同粒度的緩存鍵;

    • Safari 12.1+ 實現(xiàn)了頂部 window 域名 + URL 的鍵控制機制;

    • 新的緩存機制隔離了 iframe 內(nèi)外的跨域請求,能有效規(guī)避站點訪問嗅探、跨站搜索攻擊、跨站訪問跟蹤等隱私問題;

  • 其他安全策略:

    • Chrome 83+ 支持了 Trusted Types 以預防基于 DOM 的 XSS;

    • Chrome 80+ 全量了 SameSite Cookie 默認值 SameSite=Lax,此舉可以提升站點安全性,從源頭防御大量的 CSRF 漏洞;

    • Firefox 76+ 中使用 location.href 等方法導航到未知協(xié)議的操作將被阻止。


框架和解決方案

框架


2020年 React 沒有什么全新的概念,React Hooks 在社區(qū)從廣受關(guān)注變成了實際落地;大家等待已久的 Vue 3.0 正式發(fā)布,在保留自身特色的同時也從 React 中汲取養(yǎng)分。


  • React 發(fā)布了 17 版本,號稱一個沒有新特性的大版本更新,提供多版本 React 共存的能力;

  • 經(jīng)過持續(xù)兩年的努力,2600+ 個提交之后,Vue 3.0 發(fā)布了代號 One Piece 的正式版:

    • 重新劃分了模塊:可以減少近半運行時大小。拆出的一些獨立包也可復用在更多場景:AST 轉(zhuǎn)換、自定義渲染器(如小程序)、響應式系統(tǒng)抽離出來獨立使用;

    • 新的 Composition API:在保留原有基于對象的 API 同時提出的新的 API,以達到類似 React Hooks 式的邏輯重用;     

    • 性能提升:與 Vue2 相比,打包后文件尺寸 (tree-shaking 時減少了 41%)、初始渲染 (快了 55%)、更新 (快了 133%) 和內(nèi)存使用 (少了 54%) 方面都有顯著的性能提升,模板編譯時優(yōu)化對性能提升有很大貢獻     ;

    • 更好的 TypeScript 集成:Vue3 由 TypeScript 寫成,新的 Composition API 能很好支持 TS 類型推斷,官方的 VSCode 擴展 Vetur 支持了模板中的類型檢查,Vue3 更是完整支持了 tsx。


Webpack 又有更多對手


出于對 Webpack 的愛恨交加,大家紛紛用更新穎的想法或更激進的技術(shù)造起了全新的開發(fā)工具鏈,也促使 Webpack 加快自我迭代的步伐。


  • Webpack 5.0 正式發(fā)布,這是時隔 2 年半的大版本更新,通過持久緩存提高構(gòu)建性能,通過更好的 Tree Shaking 和代碼生成來降低打包大??;

  • vite 作為 Vue 作者的新項目快速引來關(guān)注,它基于瀏覽器原生 ES imports,因而有更快的冷啟動和熱更新,整體速度與模塊數(shù)量無關(guān)。沒有打包的過程,源碼直接傳輸給瀏覽器使用原生的

最新網(wǎng)站案例

洞悉市場趨勢演變讓傳播回歸社會

免費獲取網(wǎng)站建設與網(wǎng)絡推廣方案報價

  • 關(guān)于我們

    深圳市廣雅達科技有限公司,是一家新型的全案網(wǎng)絡開發(fā)公司,作為以互聯(lián)網(wǎng)高端網(wǎng)站建設、APP開發(fā)、小程序開發(fā)為核心的專業(yè)網(wǎng)絡技術(shù)服務供應商,廣達網(wǎng)絡致力于全面分析市場環(huán)境、衡量與預測市場需求、整合區(qū)別于行業(yè)競爭對手的絕對優(yōu)勢,結(jié)合品牌理念深度挖掘項目優(yōu)勢和產(chǎn)品價值,提升客戶品牌認知、認可度。

  • 我們的客戶

    廣達網(wǎng)絡歷經(jīng)十年沉淀,與國內(nèi)外數(shù)千家客戶達成合作關(guān)系。廣達網(wǎng)絡始終堅持“帷有專業(yè),才能拓展無限”的服務理念,堅持“認真堅持細節(jié)”的優(yōu)質(zhì)服務理念,不斷完善自身,成就企業(yè),最終實現(xiàn)共贏。

  • 我們的業(yè)務

    廣達網(wǎng)絡主營業(yè)務范圍包含互聯(lián)網(wǎng)高端網(wǎng)站建設、APP開發(fā)、小程序開發(fā)、商城網(wǎng)站建設、公眾號運營以及數(shù)字營銷等,涵蓋了服務、房產(chǎn)、數(shù)碼、服裝、物流貿(mào)易等行業(yè),根據(jù)品牌現(xiàn)狀,為每個客戶量身定制項目整體服務方案,以敏銳的市場洞察力、創(chuàng)新的市場策劃能力,全面把握市場變化,為客戶實現(xiàn)從企業(yè)到消費者的價值轉(zhuǎn)換。

Designerpart Designagentur
Designerpart Designagentur
Designerpart Designagentur
Designerpart Designagentur
Designerpart Designagentur
Designerpart Designagentur