1. <strong id="7actg"></strong>
    2. <table id="7actg"></table>

    3. <address id="7actg"></address>
      <address id="7actg"></address>
      1. <object id="7actg"><tt id="7actg"></tt></object>

        前端發(fā)展預(yù)測(cè):未來哪些技術(shù)值得關(guān)注?

        共 3626字,需瀏覽 8分鐘

         ·

        2021-09-08 02:35

        作者 | Browser London
        譯者 | 吳留坡
        策劃 | 田曉旭
        2018 年、2019 年、2020 年我們都做了前端發(fā)展預(yù)測(cè),鏈接見文末,本文是 2021 年前端發(fā)展預(yù)測(cè)。
        React 框架終于成熟了

        React 在 MVC 中經(jīng)常被稱為“V”,它既受益又受困于缺乏固執(zhí)己見的框架。多年過去了,我們還沒有看到這個(gè)行業(yè)在一個(gè)堆棧、體系結(jié)構(gòu)或工具鏈上聯(lián)合起來。盡管這種靈活性無疑有助于其普及,但 2021 年可能是我們最終看到此類框架走向成熟的一年。

        在過去的一年里,Vercel 公司繼續(xù)在 React 領(lǐng)域占據(jù)主導(dǎo)地位,不斷完善其框架,Next.js 以及他們自成一套的服務(wù),同時(shí)推出了一個(gè)電子商務(wù)初學(xué)者工具包和一個(gè)分析工具:

        https://nextjs.org/commerce

        https://nextjs.org/analytics

        并舉辦了他們最大的虛擬會(huì)議。雖然 Next 已經(jīng)出現(xiàn)了很長(zhǎng)一段時(shí)間,造好輪子并經(jīng)過了很久的實(shí)踐,但功能大而全的方式并不適用于所有人(譯者注,原文 batteries-included,這個(gè)詞語源自 Python 語言,指官方發(fā)行版 CPython 自帶了相當(dāng)齊全的軟件庫,拿來就可以直接寫程序,一般不需要再去安裝額外的庫,類似買一個(gè)電動(dòng)玩具里面自帶了電池一樣,拆開后簡(jiǎn)單裝配即可使用),但是去年最終發(fā)布的 v10,穩(wěn)定性出人意料,最終采用了子路徑路由:

        https://www.nextjs.cn/docs/advanced-features/i18n-routing

        Vercel 公司正努力通過他們最新的主題演講來宣傳產(chǎn)品,包括“drops”。

        https://nextjs.org/blog/next-10

        今年,新的閉源 React 框架 Remix 悄無聲息地推出了“支持者預(yù)覽版”。Remix 由社區(qū)中的兩位大牛 Jackson 和 Florence 創(chuàng)建,他們成名于 React Router,采取了不同于 Next 的方法——既有商業(yè)模式(每年收取一筆不多的許可費(fèi))也有體系概念(Remix 是一個(gè)產(chǎn)品,而不是一個(gè)平臺(tái))。Remix 承諾將利用更傳統(tǒng)的技術(shù),比如積極的 Http 緩存,重新關(guān)注基本網(wǎng)頁,而不是傾向于靜態(tài)頁面生成。

        https://remix.run/features

        現(xiàn)在還為時(shí)過早——Remix 要到明年才能正式推出——而且不太可能實(shí)現(xiàn)像 Ember 這樣的一體化工具。盡管如此,在這個(gè)長(zhǎng)期停滯不前的領(lǐng)域看到事態(tài)發(fā)展還是讓人耳目一新。

        DOM 容器查詢

        (譯者注,這里的容器是頁面 DOM 容器,不是另一個(gè)完全不相干的 docker 容器)對(duì)容器查詢的需求已經(jīng)達(dá)到了狂熱的程度。隨著谷歌最終宣布他們的原型計(jì)劃,2021 年可能是我們第一次看到。

        https://groups.google.com/a/chromium.org/g/blink-dev/c/u1AKdrXhPGI/m/wrJb-unhAgAJ?pli=1

        與此同時(shí),越來越多地采用固有的網(wǎng)頁設(shè)計(jì):

        https://www.browserlondon.com/blog/2019/08/19/should-we-still-be-selling-responsive-web-design

        結(jié)合 CSS 的 min/max/clamp 和 JS 的 ResiveObserver 等 API,提供了更好的“偽裝”方法。這類實(shí)現(xiàn)越來越多(甚至可能是危險(xiǎn)的?)在過去的幾個(gè)月里,很難想象這種趨勢(shì)會(huì)在明年停止。

        譯者注,ResiveObserver 是一個(gè)試驗(yàn)特性,類似 document.onresize,ResiveObserver 可以監(jiān)聽到 Element 的內(nèi)容區(qū)域或 SVGElement 的邊界框改變。避免了在自身回調(diào)中調(diào)整大小,從而觸發(fā)無限回調(diào)和循環(huán)依賴。僅通過在后續(xù)幀中處理 DOM 中更深層次的元素來實(shí)現(xiàn)這一點(diǎn)。詳見:

        https://developer.mozilla.org/zh-CN/docs/Web/API/ResizeObserver

        我希望我們能看到更聰明的方法來接近容器的第一個(gè)設(shè)計(jì),如 Mathias 的 Raven 和 Heydon 的 Watched Box。

        WASM 爆炸

        WebAssembly 的發(fā)展很緩慢,這在很大程度上是因?yàn)樗珜I(yè)了(“如果需要它,你會(huì)知道的”)。然而,到 2021 年,我們可能會(huì)看到這種轉(zhuǎn)變。

        隨著前端開發(fā)人員的角色逐漸向“全棧”領(lǐng)域發(fā)展,我們開始看到更多的工程師采用較低級(jí)別的系統(tǒng)語言,比如 Rust,盡管 Mozilla 裁員后出現(xiàn)了最初的不確定性,但 Rust 目前正受到空前的熱捧:

        https://twitter.com/nadavrot/status/1319003839018614784

        因此,我們看到了基于 WASM 的解決方案,如 Yew 和 Seed.rs 進(jìn)入前端框架。得益于 Rust 提供的性能和安全性,2021 年很可能是 WASM 出現(xiàn)大規(guī)模繁榮的一年。

        https://wingolog.org/archives/2020/10/15/on-binary-security-of-webassembly

        我們離這些大公司關(guān)注的熱點(diǎn)還有很長(zhǎng)一段路,但我相信 2021 年采用率會(huì)激增。

        快要達(dá)成一致了

        (譯者注,原文 monolith,巨石,單一龐大的組織,這里是前端采用的技術(shù)??梢赃_(dá)成一致)業(yè)界對(duì)分布式服務(wù)和精心劃分責(zé)任的熱愛仍在繼續(xù),已經(jīng)超越了后端(比如微服務(wù) https://www.browserlondon.com/blog/2019/07/01/do-you-need-microservices),并在 2019 年達(dá)到了頂峰,推出了微前端(同樣受到詬病和喜愛的)。Unix 哲學(xué)的體系結(jié)構(gòu)方法繼續(xù)受到限制,至少在技術(shù)報(bào)告和媒體文章領(lǐng)域是如此。

        在過去的幾年中,微服務(wù)的廣泛使用使得諸如 Backend For Frontend 之類的模式成為必要,它在每個(gè)客戶機(jī)和為其提供服務(wù)的 API 之間引入了一個(gè)中介。

        -BFF 充當(dāng)“粘合劑”,是客戶端的單一聯(lián)系點(diǎn)。這允許使用該服務(wù)的客戶端變得一致(并且非常適合)。

        考慮到目前對(duì) JAMStack 的興趣,這一點(diǎn)在 2021 年尤為重要,JAMStack(譯者注,JAMStack 是新興的技術(shù)概念,區(qū)別于以往服務(wù)器端渲染,而是采用 JS 腳本、API 服務(wù)接口、Markup 模版,通常直接使用 CDN 分發(fā)靜態(tài)的頁面,完全不需要渲染頁面,網(wǎng)站的伸縮性、穩(wěn)定性可以得到最大的保障。)最為復(fù)雜,受到服務(wù)依賴的影響:

        https://www.browserlondon.com/blog/2020/04/20/issues-with-jamstack-you-might-need-backend

        https://www.browserlondon.com/blog/2020/09/02/dependency-hell-how-to-avoid-it

        有趣的問題,“如何組裝我的 API”的答案是:構(gòu)建一個(gè)。

        2021 年會(huì)看到使用 BFF 技術(shù)的有所增加,但如果運(yùn)氣好的話,我們也可能會(huì)看到它逐漸回歸到巨石陣,或者至少會(huì)以更大的“宏觀服務(wù)”:

        https://twitter.com/GergelyOrosz/status/1247132806041546754

        或諸如城堡之類的妥協(xié)形式緩慢撤退:

        https://m.signalvnoise.com/the-majestic-monolith-can-become-the-citadel

        毫無疑問,Basecamp 的 DHH,這位“雄偉”巨石最有力的支持者(他最近推出了另一款傳統(tǒng)的網(wǎng)絡(luò)應(yīng)用 Hey)將領(lǐng)導(dǎo)這次行動(dòng)。

            總結(jié)    

        有趣的是,前端最大的發(fā)展方向不太可能是通常的關(guān)注點(diǎn)。前端開發(fā)人員的角色正日益向“全?!鞭D(zhuǎn)變。

        這是一個(gè)自然的交匯點(diǎn),前端工程師面臨著越來越多的“后端”問題,而工具和服務(wù)正變得足夠復(fù)雜,以降低進(jìn)入壁壘。

        逆鋒起筆是一個(gè)專注于程序員圈子的技術(shù)平臺(tái),你可以收獲最新技術(shù)動(dòng)態(tài)最新內(nèi)測(cè)資格、BAT等大廠大佬的經(jīng)驗(yàn)、增長(zhǎng)自身、學(xué)習(xí)資料、職業(yè)路線、賺錢思維,微信搜索逆鋒起筆關(guān)注!

         延伸閱讀

        前端異常埋點(diǎn)系統(tǒng)初探

        知乎高贊:什么是前端工程化

        一套標(biāo)準(zhǔn)的前端代碼工作流

        前端與后端 的區(qū)別,一圖恍然大悟!

        一個(gè)無名前端的 10 年前端路

        瀏覽 46
        點(diǎn)贊
        評(píng)論
        收藏
        分享

        手機(jī)掃一掃分享

        分享
        舉報(bào)
        評(píng)論
        圖片
        表情
        推薦
        點(diǎn)贊
        評(píng)論
        收藏
        分享

        手機(jī)掃一掃分享

        分享
        舉報(bào)
        1. <strong id="7actg"></strong>
        2. <table id="7actg"></table>

        3. <address id="7actg"></address>
          <address id="7actg"></address>
          1. <object id="7actg"><tt id="7actg"></tt></object>
            亚洲综合色婷婷五月 | 成人片无码观看在线视频 | 色婷婷操逼 | 女同精油按摩做爰 | 操碰AV | 久久鬼| 日本a在线观看 | 2022男人天堂 | 夜夜天天 | 毛片乱伦 |