IOS的下拉刷新及图文列表下拉闪烁的问题

运行环境：iphone6 IOS8.3，MUI 1.8

APP结构是titlebar 加底部选项卡，就是Hello MUI中的tab-webview模式。我的子页面是一个slider加10条记录的图文列表(table-view)。然后这个页面只使用了下拉刷新。数据是ajax拉取服务器的，每次仅10条，图片资源是本地的。现在发现了２个问题：

１、下拉刷新释放后会卡住，50次能遇到个3次左右，如图

２、抛开上面的下拉。对整个页面进行滚动的时候，因为我有１０条数据，比如我拉到第５条这个位置，下面应该是第6,7...条，但有时候拉的这个位置的时候(手已经释放或者没有释放的情况都会遇到），下面的位置显示是空白的，延迟1~2秒才显示出来。给我的感觉好像是才动态插入了下面的6,7....等数据，又或者是下面的数据重新渲染了一遍一样。但这个问题不是发生在我拉取了服务器数据后，第一次滚动发生。而是任何时间都有可能发生，即使我第一次滚动的时候是正常的。

JS代码

    <script>  
        var recipeView;     //查看页面对象  
        mui.init({  
              pullRefresh : {  
                container:"#refreshContainer",//下拉刷新容器标识，querySelector能定位的css选择器均可，比如：id、.class等  
                down : {  
                  contentdown : "下拉刷新",//可选，在下拉可刷新状态时，下拉刷新控件上显示的标题内容  
                  contentover : "释放立即刷新",//可选，在释放可刷新状态时，下拉刷新控件上显示的标题内容  
                  contentrefresh : "正在刷新...",//可选，正在刷新状态时，下拉刷新控件上显示的标题内容  
                  callback :loadData //必选，刷新函数，根据具体业务来编写，比如通过ajax从服务器获取新数据；  
                }  
              }  
        });  

        function loadData() {  
            //拉取新数据  
            mui.ajax('http://192.168.1.103/2015/czl/publish/api/web/v1/recipes/new',{  
                dataType:'json',  
                type:'get',  
                success:function(data){  
                    var html=template('test',{data:data});  //artTemplate替换Html内容  
                    mui('#refreshContainer').pullRefresh().endPulldownToRefresh();  
                    document.getElementById("list-content").innerHTML=html;  

                },  
                error:function(xhr,type,errorThrown){  
                    console.log(xhr.toString()+'martin');  
                }  
            });  

        }  
        var slider = mui("#slider");  
        slider.slider({  
            interval: 5000  
        });  

        mui.plusReady(function(){  
            loadData(); //加载数据  

            plus.navigator.closeSplashscreen(); //当处理完加载后关闭启动页  

        })  
    </script>

这是图片列表的代码，slider的代码跟demo一样的，就不上了。在以下代码中我添加了.czl-table-view

.czl-table-view-cell:after{left:0;}  
.mui-table-view .mui-media-object {line-height: 68px;max-width: 90px;height: 68px;}  

        <ul class="mui-table-view czl-table-view" id="list-content">  

            <script id="test" type="text/html">  
            {{each data as item index}}   
            <li class="mui-table-view-cell czl-table-view-cell mui-media">  
                <a href="#" id="{{item.id}}" title="{{item.title}}">  
                    <img class="mui-media-object czl-media-object mui-pull-left" src="{{item.cover}}"  width="90">  
                    <div class="mui-media-body">  
                        {{item.title}}  
                        <p class='mui-ellipsis'>{{item.intro}}</p>  
                    </div>  
                </a>  
            </li>  
            {{/each}}  
            </script>  
        </ul>