2018年你應該瞭解的前端新技術

Parcel:超快的Web應用打包器

雖然 webpack 帶來了許多可配置性,同事也造就了它的複雜性。 而 Parcel 帶來簡單性。 官方號稱 Parcel 為 “零配置” ,開箱即用。

正如上面所說的 – Parcel 內置了一個開箱即用的開發服務器。 開發服務器將在你更改文件時自動重新構建你的應用程序,並支持以實現快速開發。

2018年你應該瞭解的前端新技術


<code>Parcel 有什麼好處?1.快速打包 – Parcel 比 Webpack,Rollup 和 Browserify 更快。2.Parcel 支持 JS、CSS、HTML、資源文件等等 – 無需插件 – 更加便於用戶使用。3.零配置。開箱即用的代碼拆分,模塊熱替換,CSS 預處理器,開發服務器,緩存等等;4.更加友好的錯誤日誌。我們應該什麼時候使用 Parcel , Webpack 或 Rollup 呢?這完全取決於你,但我個人會在以下情況下使用每個打包器:Parcel:中小型項目(代碼行小於 15k)Webpack:大型以及企業級項目。Rollup:用於 NPM 包。讓我們給 Parcel 一個機會
/<code>

PWA是否能帶來新一輪大前端技術洗牌?

漸進式網絡應用 ( Progressive Web Apps ),即我們所熟知的 PWA。自 2015 年以來,PWA 相關的技術不斷升級優化,在用戶體驗和用戶留存兩方面都提供了非常好的解決方案。PWA 可以將 Web 和 App 各自的優勢融合在一起:漸進式、可響應、可離線、實現類似 App 的交互、即時更新、安全、可以被搜索引擎檢索、可推送、可安裝、可鏈接。PWA 不是特指某一項技術,而是應用了多項技術的 Web App。其核心技術包括 App Manifest、Service Worker、Web Push、Credential Management API ,等等。其核心目標就是提升 Web App 的性能,改善 Web App 的用戶體驗。下面我們詳細地看一下這些核心技術,是否能夠真正彌補 Web 劣勢。

Web App Manifest

Web App Manifest 是為了解決用戶留存問題而誕生的,它是一個外鏈的 JSON 文件,在這個文件中,像瀏覽器暴露了站點的名稱,地址,圖標等等元數據。在瀏覽器中通過 引入這個 JSON 文件,瀏覽器識別到這個文件的存在,會根據自己的機制決定是否彈出添加到桌面對話框,並在桌面上生成一個應用的圖標,通過點擊桌面圖標進入應用具有沉浸式的體驗,全屏顯示,沒有瀏覽器地址欄,並且還會自動添加應用啟動畫面。

Service Worker

Service Worker 是一個特殊的 Web Worker,獨立於頁面主線程運行,它能夠攔截和處理網絡請求,並且配合 Cache Storage API,開發者可以自由的對頁面發送的 HTTP 請求進行管理,這就是為什麼 Service Worker 能讓 Web 站點離線的原因。

Push Notification

Push Notification 其實是兩個 API 的結合, Notification API 和 Push API 。Notification API 提供了開發者可以給用戶發送通知的能力,包括申請顯示通知權限,發起通知,以及定製通知的類型等等。Push API,則是讓服務器能夠向用戶發送離線消息,即使用戶當前並沒有打開你的頁面,甚至沒有打開瀏覽器。

各家瀏覽器廠商在 2017 年開始大力支持 PWA,連蘋果都已經在幾個月前悄悄的進行了 Service Worker 的開發了,iOS 也將支持 PWA。各大站點紛紛實踐,用 PWA 已成趨勢。


分享到:


相關文章: