JQuery效率问题
1,前言
我们开发了一个专题系统,生成了JSON的数据格式,采用JQuery动态插入HTML中,在前期的使用中,没有太大的问题,效率还可以接受,但是最近可能由于网络加之页面设计问题,我们的JS效率比较差,长达10多秒中,实在难以忍受,到底是什么原因呢?
2,分析
我观察了一下JS脚本,应该说没有太费时间的操作,采用ID的元素选择法,应该是最快的,虽然有个类选择器,但是元素很少,一般在2个左右,不至于影响效率,我注释一下,发现确实不是这个问题。
后来分析,可能是HTML外面套的INDEX.JSP的问题,加上头尾后,效率很慢,所以我们分析思路:
2.1 把JSP分出top,bottom.jsp,采用jquery load()事件加入至页面,确实效率有所提升,但是在FF,和CHROME下不太正常,而调整后,都正常显示,但是效率又下降了。
2.2 采用IFrame方式:把页面的头和尾部采用Iframe嵌入,去掉边框,固定大小,这个确实效率提高了,但是ifram里的跳转是个大问题,效果不是很好;
3,根本原因
我们吧注意力放在了JS上面,突然想到,是不是$(document).ready()方法的原因??
我们去掉此方法,变为函数,同时在页面中用setTimeout()延时10毫秒触发,发现,正常了;
我网上查了一下read方法的说明:
JQuery效率问题的更多相关文章
- jQuery效率提升建议
jQuery简洁通用的方法集把编码者从繁重的工作中解脱出来,也拉低了进入javascript的门槛,初学者对浏览器兼容性一无所知的情况下,几行代码就可以写出超炫的特效.网上有一篇文章转载比较泛滥,已经 ...
- jQuery 效率提升建议
jQuery简洁通用的方法集把编码者从繁重的工作中解脱出来,也拉低了进入javascript的门槛,初学者对浏览器兼容性一无所知的情况下,几行代码就可以写出超炫的特效.网上有一篇文章转载比较泛滥,已经 ...
- 移动端H5混合开发设置复盘与总结
此篇接上一篇: 移动端H5混合开发,Touch触控,拖拽,长按, 滑屏 实现方案 https://www.cnblogs.com/buoge/p/9346699.html app 场布设置已经上线了, ...
- nodejs--vue
nodejs--vue 基础知识认识: 前端工程化 最近才兴起,nodejs(包的管理更加方便),webpack 数据双向绑定 mvm 数据驱动vue,vue改变数据 组件化开发 vue 中的常见 概 ...
- 十条jQuery代码片段助力Web开发效率提升
JQuery是继prototype之后又一个优秀的Javascript库.它是轻量级的js库 ,它兼容CSS3,还兼容各种浏览器(IE 6.0+, FF 1.5+, Safari 2.0+, Oper ...
- paip.提升效率--数据绑定到table原理和流程Angular js jquery实现
paip.提升效率--数据绑定到table原理和流程Angular js jquery实现 html #--keyword 1 #---原理和流程 1 #----jq实现的代码 1 #-----An ...
- jquery选择器效率优化问题
jquery选择器效率优化问题 jquery选择器固然强大,但是使用不当回导致效率问题: 1.要养成将jQuery对象缓存进变量的习惯 //不好的写法 $('#btn').bind("c ...
- 10 款提高开发效率的 jQuery/CSS3 组件
前端开发是一项十分繁琐而又耗体力的工作,如何更有效率的开发我们的应用,很多人会选择适当地使用一些jQuery插件.今天就要给大家分享10款可以提高开发效率的jQuery/CSS3组件.部分插件可以下载 ...
- js jquery版本的 金额千分位转换函数(非正则,效率极高)
没想到js里面没有 金额千分位格式化的处理函数(例:1,234.01 这样的格式),网上搜了一圈,都是使用正则的方式处理的.正则的效率不敢恭维啊,又耗费资源速度又慢(虽然处理起来会直观一些). 因此专 ...
随机推荐
- python语法(四)— 文件操作
前面几天学习了一写python的基础语法,也学习了分支if,循环while和for.由于之前已经做过几年的开发了,所以我们知道,许多数据来源并不是靠键盘输入到程序中去的,而是通过数据库和文件来获取到的 ...
- 51nod 1584加权约数和
学到了好多东西啊这题... https://blog.csdn.net/sdfzyhx/article/details/72968468 #include<bits/stdc++.h> u ...
- spring-boot 速成(6) 整合disconf
spring-boot虽然不推荐使用xml文件做为配置文件,但是并没有把路堵死,所以与disconf的整合,仍旧可以沿用之前的xml方式来处理. 一.在Application类上用注解导入xml pa ...
- Supported Values for @SuppressWarnings(转)
Update July 2011: This list has been reviewed and made current with the most recent Eclipse 3.7 rele ...
- mozilla/rr 调试
http://rr-project.org/ https://github.com/mozilla/rr
- 得到Revit子窗体
start /// <summary> /// 得到主窗体句柄 /// </summary> /// <returns></returns> publi ...
- Android笔记之属性动画
前言.动画分类 例如以下图所看到的,Android的动画主要分为三种: 以下首先说说 属性动画 所谓属性动画-- 就是指对象的属性值发生了变化,如控件位置和透明度等. 举例,如今要实现一个按键先下移. ...
- AngularJS路由系列(3)-- UI-Router初体验
本系列探寻AngularJS的路由机制,在WebStorm下开发. AngularJS路由系列包括: 1.AngularJS路由系列(1)--基本路由配置2.AngularJS路由系列(2)--刷新. ...
- Android 模拟器设置
这几个图标你应该是没有见过的,我来简单为你介绍下.最左边的图标其实你已经比较熟悉了,就是你睡觉前使用过的Android SDK管理器,点击它和点击SDK Manager效果是一样的.中间的图标是用来开 ...
- 理解 HTTPS 协议
英文原文:Understanding HTTPS Protocol 最近我们看到很多站点使用 HTTPS 协议提供网页服务.通常情况下我们都是在一些包含机密信息的站点像银行看到 HTTPS 协议. 如 ...