資訊專欄INFORMATION COLUMN
摘要：起因一天在群里面朋友問了一個這么一個問題看了之后自己梳理了一遍，在此和大家分享一下，這個就要從客戶端開發的過程來講了原生開發在移動互聯網剛興起的時候，最初的開發模式是通過或開發原生應用，有一些網頁跳轉的處理，使用之后增加了，安卓使用的是這個
起因
一天在群里面朋友問了一個這么一個問題：
看了之后自己梳理了一遍，在此和大家分享一下，這個就要從客戶端開發的過程來講了；
原生開發在移動互聯網剛興起的時候，最初的開發模式是通過swift或java開發原生應用，有一些網頁跳轉的處理，ios使用UIWebView（ios8之后增加了WKWebView），安卓使用的是webview；這個時候業務模式還不是特別復雜，用戶也沒有那么多，迭代時間的的長短也不是特別強烈。 隨著業務的發展，這種開發模式逐漸就出現了一下問題
業務逐漸變得龐大，原生開發需要更多的人員
業務變得更加復雜，多端的功能開發完全是重復的
ios審核發版的時間限制，可能只是一個小的UI的修改，都需要重新發版
hybrid （native+H5）基于上面的這些困擾，出現了一類似PhoneGap、Ionic的hrbrid應用，他們的作用是把h5開發好的頁面，通過打包封裝處理到webview里面，最后瀏覽操作的其實還是h5，只不過這個過程h5可以調取一下原生的功能，而這個h5調用原生功能實現的底層概念叫做jsbridge，或者說jsbridge是native原生與h5通信實現的一個過程。而這PhoneGap、Ionic之類的應用的核心就是它們實現了這么一個過程，并且把接口暴露出來，上層h5調用就好；
簡單來說，PhoneGap框架流程就以下三步：
1、js 通過prompt接口往anroid native 發送消息
2、android 本地攔截WebChromeClient 對象的 onJsPrompt函數，截獲消息
3、android本地截獲到消息以后，通過Pluginmanager把消息分發到目的插件，同時通過jsMessageQueue收集需要返回給js的數據；
引用網上的一張圖，一起來看看PhoneGap底層框架類圖~~
但是這個模式在取決于WebView的解析渲染效率，在頭幾年硬件還不死特別硬的時候，h5的渲染及交互不是特別友好，會出現卡頓；
RN、weex （DSL）由于hybrid的開發成本一套多用和h5發版不需要審核的因素，facebook研究處理相應模式的框架，把對于性能影響的渲染的步驟做了處理，不管是RN還是Weex，他們的開發語言都是js、html、css，只不過在編譯的時候，比如RN轉換成了相應的Virtual DOM之后，在native的底層實現了一套把virtual DOM轉換成原生組件的機制，這個過程是把virtual DOM轉換成了類似JSON的語言形式，最后通過自己的解析模式給實現成native的組件，這個性能自然也就會好很多，但是這個實現類似的JSON，也可以叫做DSL，sql語句其實也會DSL，包括html也算是一套DSL語言。
而在ios里面有一個JavaScriptCore的框架，通過它就能實現JS和OC（通過它可以調用和渲染原生模塊）交互
架構的模式還在不斷的演進，比如最近又流行起來了hybrid的模式。上面的幾個問題通過這篇文章也做了個大概的簡述，更加深入的東西，還需要不斷學習；
歡迎關注玄說前端公眾號，后續將推出系列文章《一個大型圖形化應用0到1的過程》，此賬戶也將同步更新
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/98487.html
摘要：的語言的動態性意味著我們可以使用以上種數據類型表示變換過渡動畫實現案例前端掘金以下所有效果的實現方式均為個人見解，如有不對的地方還請一一指出。 讀 zepto 源碼之工具函數 - 掘金Zepto 提供了豐富的工具函數，下面來一一解讀。 源碼版本 本文閱讀的源碼為 zepto1.2.0 $.extend $.extend 方法可以用來擴展目標對象的屬性。目標對象的同名屬性會被源對象的屬性...
閱讀 2666·2023-04-25 15:22
閱讀 2837·2021-10-11 10:58
閱讀 1060·2021-08-30 09:48
閱讀 1864·2019-08-30 15:56
閱讀 1740·2019-08-30 15:53
閱讀 1106·2019-08-29 11:16
閱讀 1058·2019-08-23 18:34
閱讀 1649·2019-08-23 18:12
