IOING是做什么的？IOING在你的代码和浏览器之间建立了一个中间解释层，它提供了一套新的语法来填充浏览器没有的能力。SPA开发痛点开发SPA应用的痛点是不同模块页面的状态保存。当从一个页面跳转到另一个页面时，窗口的所有状态都会被清除并重新加载，历史页面和当前页面之间不会有任何联系，这个过程就是一个推倒重建的过程。想要回到历史，只能推倒重建，而在这个过程中，加载窗口难免会出现白屏。很显然，如此丑陋的效果不符合高尚app的要求。但是这种方式因为前后端页面不共存的简单特性，也简化了开发逻辑。开发者只需要考虑单个页面的逻辑，每加载一个新页面，就可以完全更新之前的页面。释放，不用担心耦合度高，内存无法完全释放的问题。这也是传统技术的优势。虽然简单粗暴，但是效果很好。那么有没有一种方法可以两全其美呢？传统模式带来的挑战不同于SPA应用，多页应用往往比较简单。页面之间不需要复杂的数据交换，也不需要保存页面历史，所以使用传统技术是最合适的。但是SPA应用需要协调页面之间的关系，它的各个模块之间可能有联系，需要维护窗口的数据状态，从而催生了另一种技术的流行，那就是使用Ajax和模板将新模块的内容加载到当前页面，但是这样也会导致新加载模块的脚本和DOM树内容堆积在主文档下，在不需要的时候无法移除释放（比如僵尸事件）如设置超时）。另一种情况是，一旦其中一个模块出现错误，很可能会导致整个SPA应用崩溃。除了耦合度高的问题，Ajax每次加载大量的DOM结构到主DOMTree中，都可能导致这个庞大的DOMTree进行回流（reflow）和重绘（repaint），从而影响整体的运行效率。分析基于以上分析，我们要想得到一个稳定的SPA应用，就必须修改浏览器使其支持以下特性：为保证应用的松耦合，浏览器必须具备防止新加载的模块干扰应用的能力加载的模块。为了防止浏览器加载大量模块时内存占用过高，浏览器应该使移除的模块完全释放。浏览器应该让模块运行在一个独立的空间，以保证当模块本身出错时，整个应用程序不会停止工作。只有具备这些特性，才能保证大型Web应用的稳定运行，那么IOING是如何处理上述问题的呢？首先，为了保证模块代码错误不影响整个应用的运行，我们需要保证除引擎之外的所有不可控脚本都不能在主窗口下运行，模块脚本需要在单独的沙箱中运行.什么是沙盒模块？沙盒（Sandbox）简单来说就是：不解释大家就明白了，但是很多人看到一个iframe就开始各种着急，想到负面的描述各种文章中的iframe。这里需要说明一下。iframe直接作为内嵌网页使用时，确实会占用当前页面连接池，但其在引擎中的主要目的是作为沙箱使用，而不是内嵌网页。引擎在编译内容的时候，会先主动创建一个空的iframe，然后直接把编译好的内容丢进去。请注意，iframe的src="_blank"是一个空页面。在这种情况下，iframe将不会共享主窗口的连接池。我们想象这样一个场景：你在浏览器中打开多个窗口来加载不同的模块页面，然后当你需要打开其他页面时，你可以使用自定义动画让浏览器窗口进行动画过渡来显示页面，而当你return同时可以通过反向动画将上一个窗口的内容过渡回来。如果浏览器支持这些，也许webApp会看起来更酷，但现实是浏览器没有这样的操作？?♂?。而这个想法可以通过沙箱来实现。沙箱中的页面就像打开了一个新的浏览器窗口。可以很好的隔离模块的DOM元素和变量，也可以保存页面的状态，通过动画进行控制。过渡。沙盒虽然很安全，但是过于独立，导致模块内的元素突破沙盒，显示在模块外的区域。比如一些复合模块（即嵌在主模块中的模块，沙盒一般适用于独立的全屏模块），当你有这种需求时，沙盒特性就无法满足你。这时，你应该支持另一种模块运行方式：shadowbox应运而生。shadowbox使用shadowbox配置的模块，它的模块内容会作为一个新的DOMTree插入到主DOMTree中（即shadowdom模式）。这个新的DOMTree中的CSS样式和元素id不会与外部元素耦合，并且此时模块的js文件仍在其沙箱中运行。（如果运行的浏览器不支持这个特性，应该会自动降级。）当然，只有一个沙盒模型是不够的。比如组件也需要合理的运行机制。之后《两分钟看懂IOING》将继续介绍以下主题：组件设计与通信模块刷新机制QuantumDOM原理（区别于Def算法的数据双向绑定设计）CSS引擎设计思路更多...敬请期待IOING开发大型SPA应用的必要技术条件是什么？如何用js获取虚拟键盘高度？（适用于所有平台）让CSS完成背景图，加载背景图后显示。解析IOING的onloadurlIOING原理主要特点IOING是一个高性能的前端开发引擎。提供了创建大型应用的一整套解决方案，如页面模块化拆分、分层路由控制、可编程CSS、热插拔组件、双向数据绑定、DOM语法扩展、自动兼容处理等。QR代码关注我公众号：资源传送门：IOING类IOS界面传送门：官网传送门：Github项目地址
