[TOC]
## Android與H5交互
### Android調用JS代碼的方法主要有2種:
1. WebView的loadUrl
2. WebView的evaluateJavascript
### JS調用Android代碼的方法主要有3種:**
1. WebView的addJavascriptInterface進行對象映射(低版本Android4以下好像有一些安全問題,本人沒有驗證)
2. WebViewClient 的 shouldOverrideUrlLoading 方法回調攔截 url
3. WebChromeClient 的onJsAlert、onJsConfirm、onJsPrompt方法回調攔截JS對話框alert()、confirm()、prompt() 消息
## WebView提速
H5頁面的渲染速度其實主要取決于兩個
1. js解析效率
如果js文件較多、解析比較復雜, 就會導致渲染速度較慢。或者手機的硬件性能比較差的話, 也會導致渲染速度比較慢。
2. 頁面資源的下載
一般加載一個H5頁面, 都會產生較多的網絡請求, 如圖片、js文件、css文件等, 需要將這些資源都下載完成之后才能完成渲染, 這樣也會導致頁面渲染速度變慢
### 本地資源
一些資源文件放在本地的assets目錄, 然后重寫WebViewClient的shouldInterceptRequest(WebView view, String url)和shouldInterceptRequest(WebView view, WebResourceRequest request)這兩個方法, 對訪問地址進行攔截, 當url地址命中本地配置的url時, 使用本地資源替代, 否則就使用網絡上的資源。
### 離線包
既然很多問題都是文件分散管理困難引起,而我們這里的使用場景是使用 H5 開發功能模塊,那很容易想到把一個個功能模塊的所有相關頁面和資源打包下發,這個壓縮包可以稱為功能模塊的離線包。使用離線包的方案,可以相對較簡單地解決上述幾個問題:
1. 可以預先下載整個離線包,只需要按業務模塊配置,不需要按文件配置,離線包包含業務模塊相關的所有頁面,可以一次性預加載。
2. 離線包核心文件和頁面動態的圖片資源文件緩存分離,可以更方便地管理緩存,離線包也可以整體提前加載進內存,減少磁盤 IO 耗時。
3. 離線包可以很方便地根據版本做增量更新。
4. 離線包以壓縮包的方式下發,同時會經過加密和校驗,運營商和第三方無法對其劫持篡改。
到這里,對于使用 H5 開發功能模塊,離線包是一個挺不錯的方案了,簡單復述一下離線包的方案:
1. 后端使用構建工具把同一個業務模塊相關的頁面和資源打包成一個文件,同時對文件加密/簽名。
2. 客戶端根據配置表,在自定義時機去把離線包拉下來,做解壓/解密/校驗等工作。
3. 根據配置表,打開某個業務時轉接到打開離線包的入口頁面。
4. 攔截網絡請求,對于離線包已經有的文件,直接讀取離線包數據返回,否則走 HTTP 協議緩存邏輯。
5. 離線包更新時,根據版本號后臺下發兩個版本間的 diff 數據,客戶端合并,增量更新。
### WebView的初始化
本地Webview初始化都要不少時間, 首次初始化webview與第二次初始化不同,首次會比第二次慢很多。原因預計是webview首次初始化后,即使 webview 已經釋放,但一些webview 共用的全局服務或資源對象仍沒有釋放,第二次初始化時不需要再生成這些對象從而變快。我們可以在Application預先初始化好WebView, 當第二次初始化WebView的時候速度就快多了, 或者直接將其拿來使用。
## 參考資料
[Android Webview H5 秒開方案實現](https://juejin.cn/post/6844903673697402887)
[https://juejin.cn/post/6844903586082766862]
- Android
- 四大組件
- Activity
- Fragment
- Service
- 序列化
- Handler
- Hander介紹
- MessageQueue詳細
- 啟動流程
- 系統啟動流程
- 應用啟動流程
- Activity啟動流程
- View
- view繪制
- view事件傳遞
- choreographer
- LayoutInflater
- UI渲染概念
- Binder
- Binder原理
- Binder最大數據
- Binder小結
- Android組件
- ListView原理
- RecyclerView原理
- SharePreferences
- AsyncTask
- Sqlite
- SQLCipher加密
- 遷移與修復
- Sqlite內核
- Sqlite優化v2
- sqlite索引
- sqlite之wal
- sqlite之鎖機制
- 網絡
- 基礎
- TCP
- HTTP
- HTTP1.1
- HTTP2.0
- HTTPS
- HTTP3.0
- HTTP進化圖
- HTTP小結
- 實踐
- 網絡優化
- Json
- ProtoBuffer
- 斷點續傳
- 性能
- 卡頓
- 卡頓監控
- ANR
- ANR監控
- 內存
- 內存問題與優化
- 圖片內存優化
- 線下內存監控
- 線上內存監控
- 啟動優化
- 死鎖監控
- 崩潰監控
- 包體積優化
- UI渲染優化
- UI常規優化
- I/O監控
- 電量監控
- 第三方框架
- 網絡框架
- Volley
- Okhttp
- 網絡框架n問
- OkHttp原理N問
- 設計模式
- EventBus
- Rxjava
- 圖片
- ImageWoker
- Gilde的優化
- APT
- 依賴注入
- APT
- ARouter
- ButterKnife
- MMKV
- Jetpack
- 協程
- MVI
- Startup
- DataBinder
- 黑科技
- hook
- 運行期Java-hook技術
- 編譯期hook
- ASM
- Transform增量編譯
- 運行期Native-hook技術
- 熱修復
- 插件化
- AAB
- Shadow
- 虛擬機
- 其他
- UI自動化
- JavaParser
- Android Line
- 編譯
- 疑難雜癥
- Android11滑動異常
- 方案
- 工業化
- 模塊化
- 隱私合規
- 動態化
- 項目管理
- 業務啟動優化
- 業務架構設計
- 性能優化case
- 性能優化-排查思路
- 性能優化-現有方案
- 登錄
- 搜索
- C++
- NDK入門
- 跨平臺
- H5
- Flutter
- Flutter 性能優化
- 數據跨平臺