我们开发的 h5 页面运行在端上的 WebView 容器之中，很多业务场景下 h5 需要依赖端上提供的信息/能力，这时我们需要一个可以连接原生运行环境和 JS 运行环境的桥梁 。 这个桥梁就是 JSB，JSB 让 Web 端和 Native 端得以实现双向通信。
近些年，移动端普及化越来越高，开发过程中选用 Native 还是 H5 一直是热门话题。Native 和 H5 都有着各自的优缺点，为了满足业务的需要，公司实际项目的开发过程中往往会融合两者进行 Hybrid 开发。Native 和 H5 分处两地，看起来无法联系，那么如何才能让双方协同实现功能呢？
自从图形界面操作系统问世以来，之上的应用软件基本都会绘制界面，这也是用户使用软件的接口，叫做 UI （user interface）。涉及到用户体验、设计、具体界面的开发，是软件中和用户最近的一部分，也是多个职能的岗位交集最多的部分。
先后涌现出了具备后端能力的node，具备移动开发能力的react native，具备游戏渲染能力的cocos2d-js，以及iOS上的热修复技术JSPatch等等新技术。
PhoneGap（Codova 的前身）作为 Hybrid 鼻祖框架，是一个开源的移动开发框架，允许你用标准的web技术-HTML5,CSS3和JavaScript做跨平台的Hybird WebUI开发，应该是最先被开发者广泛认知的 JSBridge 的应用场景。而对于 JSBridge 的应用在国内真正兴盛起来，则是因为杀手级应用微信的出现。
之前介绍了移动端开发的相关技术，这一篇主要是从 Hybrid 开发的 JS Bridge 通信讲起。
引言 随着 Web 技术和移动设备的快速发展，Hybrid 技术已经成为一种最主流最常见的方案。一套好的 Hybrid架构方案 能让 App 既能拥有极致的体验和性能，同时也能拥有 Web技术 灵活的
1) 用户首次访问或小程序同步更新时，命中环境预加载 2) 用户非首次访问，命中环境预加载 3) 用户非首次访问，未命中环境预加载
在App开发中，内嵌WebView始终占有着一席之地。它能以较低的成本实现Android、iOS和Web的复用，也可以冠冕堂皇的突破苹果对热更新的封锁。 然而便利性的同时，WebView的性能体验却备受质疑，导致很多客户端中需要动态更新等页面时不得不采用其他方案。 以发展的眼光来看，功能的动态加载以及三端的融合将会是大趋势。那么如何克服WebView固有的问题呢？我们将从性能、内存消耗、体验、安全几个维度，来系统的分析客户端默认WebView的问题，以及对应的优化方案。 性能 对于WebView的性能，给人
近日，有朋友问我关于WKWebView与JS的交互问题，可我之前一直使用的是UIWebView，也不曾做过WKWebView的交互啊！接下来大家一块学习下WKWebView是怎么实现原生代码和JS交互的。
| 导语 现如今，在做移动端 H5 开发时，少不了与 Native 之间进行交互。而在Native中，H5的承载容器为 WebView，其核心是使用 WebView 控件实现加载 url。
随着 Web 技术和移动设备的飞速发展，各种 APP 层出不穷，极速的业务扩展提高了团队对开发效率的要求，这个时候使用 IOS/Andriod 开发一个 APP 似乎成本有点过高了，而 H5 的低成本、高效率、跨平台等特性马上被利用起来形成了一种新的开发模式：Hybrid APP。
| 导语 现如今，在做移动端 H5 开发时，少不了与 Native 之间进行交互。而在Native中，H5的承载容器为 WebView，其核心是使用 WebView 控件实现加载 url。 WebView的概念 WebView 用来展示网页的 view 组件，该组件是你运行自己的浏览器或者在你的线程中展示线上内容的基础。使用 Webkit 渲染引擎来展示，并且支持前进后退等基于浏览历史，放大缩小，等更多功能。 简单来说 WebView 是手机中内置了一款高性能 Webkit 内核浏览器，在 SDK 中封
这个问题首先你要明白，WKWebView有自己的进程，使用自己的存储空间来存储cookie和cache，WKWebView会忽视NSURLCache、NSHTTPCookieStorage、NSCredentialStorage这些默认的网络存储， 其他的网络类如NSURLConnection是无法访问到的。 同时WKWebView发起的资源请求也是不经过NSURLProtocol的，导致无法自定义请求。
版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/u010105969/article/details/53541088
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
工作中时常遇到需要对自己已上线 app 中的 WebView 网页进行一些调试验证的情况，以排查 bug，解决问题。
Web 页面中的 JS 与 iOS Native 如何交互？JS 和 iOS Native 就好比两块没有交集的大陆，如果想要使它们相互通信就必须要建立一座“桥梁”。
为了大家能更好的开发出一些高质量、高性能的小程序，这里带大家理解一下小程序在不同端上架构体系的区分，更好的让大家理解小程序一些特有的代码写作方式。
大家对于原生应用和混合应用已经非常熟悉了，这里就不再进行详细的介绍，用通俗易懂的话解释下他们的一些特点。
目前QQ浏览器（下简称QB）使用Hippy的业务超过100个，基本上95%的核心业务都是使用Hippy作为首要技术栈来开发。但是跟Native相比较而言，Hippy是使用JS引擎进行异步渲染，在用户从点击到打开首屏可交互过程中会有一定的耗时，影响用户体验。如何优化这段耗时，尽量对齐Native体验，想必是每个团队需要思考优化的事情。
近些年来，前端领域的跨端技术越来越多了：react native、weex、flutter、electron、kraken 等等。
对于前端开发来说，在pc端使用chrome等浏览器的开发者工具简直是好用到爆，Chrome手机模拟器可以帮助开发调试移动端web页面，然而在真机内调试起移动端web页面的时候就显得无从下手。目前已经有不少移动端的真机调试工具，本人在综合使用后推荐以下两类调试方案：chrome/safari真机调试 和 spy-debugger调试。
为了提高开发效率，开发人员往往会使用原生app里面嵌套前端h5页面的快速开发方式，这就要涉及到h5和原生的相互调用，互相传递数据，接下来就实践项目中的交互方式做一个简单的记录分享，废话不多说，直接上正文：
作为微信小程序底层 API 维护者之一，经历了风风雨雨、各种各样的吐槽。为了让大家能更好的写一手小程序，特地梳理一篇文章介绍。如果有什么吐槽的地方，欢迎去 developers.weixin.qq.com/ 开发者社区吐槽。 01 简述小程序的通信体系 为了大家能更好的开发出一些高质量、高性能的小程序，这里带大家理解一下小程序在不同端上架构体系的区分，更好的让大家理解小程序一些特有的代码写作方式。 整个小程序开发生态主要可以分为两部分： · 桌面 nwjs 的微信开发者工具（PC 端） · 移动 AP
JS调用原生不外乎就两种，一种是传假的url，也就是url拦截的方式，类似于下面这种：
《前端技术观察》是由字节跳动IES前端团队收集、整理、推荐的业界高品质前端资源合集，主要分为以下几个板块： Highlights 业界最新的技术、热点文章 业界对（新）技术的深度地、优秀地实践 Tut
NativeScript是一个runtime，它提供一些机制可以使用JavaScript构建原生的IOS、Android甚至WP（未来会加入）应用。NativeScript有很多非常酷的功能，比如MVVM和CSS渲染原生UI。但是NativeScript最令人兴奋的是它使JavaScript可以直接调用native API。 这听起来可以会令人困惑，首先看一个例子，下面是使用NativeScript编写Android app的一段代码： var time = new android.text.format.
小程序基础库采用双线程架构，一个是视图层线程，一个是逻辑层线程，两个线程协同工作，共同向上层提供了基础库能力。
上一次写前端趋势这一类的东西，是在去年的这个时候。一年多过去了，又发生了怎样的变化呢？ One JavaScript：移动应用 前有，使用 React 及 React Native 来开发 Andro
导读｜Hippy使用JS引擎进行异步渲染，在用户从点击到打开首屏可交互过程中会有一定的耗时，影响用户体验。如何优化这段耗时？腾讯客户端开发工程师李鹏，将介绍QQ浏览器通过切换JS引擎来优化耗时的探索过程和效果收益。在分析Hippy耗时瓶颈、对比业界可选引擎方案后，最终QQ浏览器通过选择使用Hermes引擎、将JS离线生成Bytecode并使用引擎直接加载Bytecode，让首帧耗时优化50%起。希望本文对面临同样困扰的你有帮助。 背景 目前QQ浏览器（下简称QB）使用Hippy的业务超过100个，基本上9
本库主要使用 WebViewJavascriptBridge 和 webkit MessageHandler进行封装。
本文主要探讨了在 Electron 应用中如何实现上传文件到服务器的功能，同时通过本地代理服务器来获取完整的cookie。首先介绍了在 Electron 应用中如何通过 XHR 上传文件到服务器，然后介绍了如何通过 LocalStorage 将文件保存在本地。最后，本文介绍了一种使用 Electron 创建本地代理服务器，从而获取完整的cookie的方法。
上面这个 slide 资料讲的非常好，算是一个入门的介绍吧。带我们建立基本的移动 web 开发知识体系和常见问题的实践。包含以下几个方面：
AngularJS 2 尽管还在Alpha阶段，但主要功能和文档已经发布。让我我们了解下Angular 1 和 2 的区别，以及新的设计目标将如何实现。 Angular 2 当前仍处于 Alpha/开发预览阶段，但是主要功能和核心文档都已经可用了。让我们一起了解下 Angular 2 的设计目标，以及实现它们的计划： Angular 2 主要目标 更易于推论 Angular 1 vs Angular 2 变化侦测 基于 Zones 的更透明的内部构件 改进的堆栈跟踪 大幅提升的性能 (以及原理)
随着移动互联网的普及和快速发展，手机成了互联网行业最大的流量分发入口。以及随着5G的快速发展，未来越来越多的“端”也会如雨后春笋般快速兴起。而“快”作为互联网的生存之道，为了占领市场，企业也会积极跟进，快速布局。同一个应用，各个“端”独立开发，不仅开发周期长，而且人员成本高。同时，作为技术人员，也不应该满足于这种重复、低能的工作状态。在这样的形势下，跨平台的技术方案也受到越来越多人和企业的关注。接下来，我将从原理、优缺点等方面为大家分享《跨平台技术演进》。
我们要通过JS与webview内容交互，就需要到这个类了，它的所有属性及方法说明如下：
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
对象存储
腾讯会议
实时音视频
