ejs和swig对比的问题之一

本来想测试下两者在nodejs中得执行速度，设置了一个测试数据，如下

var testData = {
    title:'测试标题',
    description: '<p>这是一个描述，里面用很多标签，有<h1>h1标签</h1><h2>h2标签</h2><h3>h3标签</h3><h4>h4标签</h4><h5>h5标签</h5><p>但是不会解析',
    datas : createData()
};
function createData(){
    var array = new Array();
    var tmp = '{name:"我是data{i}", age: {i}, comp: "一个大公司}';
    for(var i = 0; i < 1000; i++){
        array[i] = tmp.replace(/{i}/g, i);
    }
    return array;
}
module.exports = testData;

 

在swig中可以正常解析，但是在ejs中却一直报错，后来才发现问题：ejs中不会把字符串进行转换
在swig中，数组中得字符串会被解析为对象，可以直接使用，在ejs中却无法直接解析， 所以对上面的代码进行修改，如下：

var testData = {
    title:'测试标题',
    description: '<p>这是一个描述，里面用很多标签，有<h1>h1标签</h1><h2>h2标签</h2><h3>h3标签</h3><h4>h4标签</h4><h5>h5标签</h5><p>但是不会解析',
    datas : createData()
};
function createData(){
    var array = new Array();
    for(var i = 0; i < 1000; i++){
        array[i] = {name: "我是data" + i, age: i, comp: '一个大公司'};
    }
    return array;
}

module.exports = testData;

 

swig的模板页面testswig.html:

<!doctype html>
<html>
<head>
  <meta charset="utf-8">
  <script type="text/javascript">
    var star = new Date().getTime();
  </script>
  <title>{{title}}</title>
</head>
<body>
    <h1 id="time"></h1>
<div>
    <h1>描述</h1>
    {{description}}
</div>
<div>
    <h2>一个大列表：</h2>
    <ul>
        {% for item in datas -%}
            <li>姓名：{{item.name}}  年龄：{{item.age}}  公司：{{item.comp}}</li>
        {%- endfor%}
    </ul>
</div>
<script type="text/javascript">
    var end = new Date().getTime();
    document.getElementById('time').innerHTML = end - star;
</script>

</body>
</html>

 

ejs的模板页面testejs.ejs

<!doctype html>
<html>
<head>
  <meta charset="utf-8">
  <script type="text/javascript">
    var star = new Date().getTime();
  </script>
  <title><%= title %></title>
</head>
<body>
    <h1 id="time"></h1>
<div>
    <h1>描述</h1>
    <%= description %>
</div>
<div>
    <h2>一个大列表：</h2>
    <ul>
        <% datas.forEach(function(item) { %>
            <li>姓名：<%= item.name %>  年龄：<%= item.age %>  公司：<%= item.comp %></li>
        <% }); %>

    </ul>
</div>
<script type="text/javascript">
    var end = new Date().getTime();
    document.getElementById('time').innerHTML = end - star;
</script>

</body>
</html>

 

测试结果为：

  • 1000条数据时，用时都为2ms
  • 10000条数据时，swig用时在180ms左右，ejs首次加载时间为470ms，之后加载时间为380毫秒左右摆动。


初步测试swig胜！


这种测试有网络时间和页面加载时间，并不全是模板渲染时间，所以并不精确，但是在其他变量一定的情况下，可以算作是相对精确，差值是正确的。

 

原文地址：ejs和swig对比的问题之一

posted @ 2015-01-16 15:12  MNight  阅读(4545)  评论(0)  编辑  收藏  举报