一个初级开发者完胜十几人团队，此处有秘诀！

最近今日头条很火，作为一名喜欢钻研的开发者，仔细研究了他们的APP，发现他们自己开发了一个RPC框架，开发者应该很了解框架是有多么难构建。如果有一个开发好的框架摆在我面前，我会毫不犹豫的使用他，就像node.js或者imag.js.

imag.js是移动跨平台开发框架，通过JavaScript调用底层API接口结合封装好的UI模块，可以帮助开发者简单快速的开发APP。imag.js框架中的控件都是原生的，就像Label控件，在iOS上是调用系统的UILabel控件，而在Android上则是调用的TextView控件，确保开发出的APP在性能流畅上和原生APP相媲美。

下面我们来看看小孟提供的基于imag.js技术开发的新闻类APP。

这么多页面要写好多代码吧？这就讲到了imag.js的一大特点：代码量少、开发效率快！只要一个<list>控件就可以完成下图部分的布局。

附上源码瞧瞧（登录页面

<?xml version="1.0" encoding="utf-8"?>  
<imag>
    <page>
        <title style="background:#ffffff">  
            <left><button role="back" style="color:#1f1f1f"/></left>  
            <center><label style="color:#1f1f1f;font-size:17">手机号登陆</label></center>  
        </title>  
        <content style="background:#f4f5f6">
            <list type="transparent" style="margin:28 19">
                <item style="padding:1 1 0;border:1 #efefef">
                    <row>
                        <input type="text" placeholder="手机号" style="font-size:14;color:#0a0a0a;background:#ffffff;height:40"/>
                    </row>
                </item>
                <item style="padding:1;border:1 #efefef;background:#ffffff;col-width:*,1,70">
                    <col>
                        <row><input type="text" placeholder="密码" style="font-size:14;color:#0a0a0a;height:40;background:#ffffff;"/></row>
                    </col>
                    <col><row style="height:14;background:#efefef"></row></col>
                    <col><row><label style="font-size:14;color:#8c8c8c;align:center">找回密码</label></row></col>
                </item>
                <item style="margin:20 0;padding:14;background:#999999;corner-radius:4">
                    <col><row><label style="color:#ffffff;font-size:15;align:center">登 录</label></row></col>
                </item>
                <item style="padding:0">
                    <col><row><label style="color:#1a88d5;font-szie:14;align:center">注册账号</label></row></col>
                </item>
            </list>
        </content>
    </page>
</imag>

从代码中看，其中<imag>是XML文档的根节点，page包含整个页面的内容，是对页面的抽象和封装。上面的代码中<page>包括<title>和<content>两个部分，分别是页面的标题和内容。title是页面标题导航栏，有<center>、<left>、<right>三个子节点，分别用来在title上居中、居左和居右来摆放文本和按钮。<content>里有个<list>控件，相当一个容器，用来展示输入框和按钮。

这里只是部分代码，详细代码可以点击链接