`

【javascript】页面优化小想法

阅读更多

以前使用Ext的时候,虽然使用简单,学习也算比较简单,可对于其性能却不敢恭维。展现的速度特别的慢。

 

1,今天看到一篇关于浏览器渲染的文章。说道:

     页面Dom里面的元素被修改了的话,整个页面的document都会被重绘,即使修改的地方并不带来样式视觉上的改变。说的是ie,不确认其他的不同于ie内核的浏览器是否一样。

     其本质就是:每次的改动都会引起页面的元素重新计算布局,然后发消息给系统,系统然后重绘浏览器。多耗资源啊!

     谨记:页面js要尽可能少的变动元素的样式。虽然挺好用的。

 

 

2,以前老说页面中图片要分离出来,做另外的服务器。不明白,现在明白了,HTTP 标准中,浏览器不能在页面上开启太多个对同一地址的请求,好像说是最多2个。

    在html得到以后,浏览器会开始解析html,当碰到外联元素的时候,比如外联的css 文件啊、图片啊、js文件啊就会在解析的同时开启请求队列,将这些请求放到队列里面去。再加上前面所说的,一个页面里面全是在同一个服务器的资源会导致页面显示很慢。

   [edit by 2011-03-23]增加个小点,增加图片服务器,同样可以使请求时,减少cookie的传输。

 

 

0
2
分享到:
评论

相关推荐

    javascript 1470个效果代码 值得你收藏

    JavaScript在Web开发中的应用广泛,包括但不限于表单验证、页面交互、路由管理、Ajax异步通信、前端框架(如React、Vue、Angular)的使用等。 至于“js1470”这个文件名,可能代表这是一份包含1470个JavaScript代码...

    基于html+css+JavaScript的个人博客.zip

    HTML(HyperText Markup Language)负责定义页面的结构,CSS(Cascading Style Sheets)用于美化页面样式,而JavaScript则提供了动态交互的功能。下面将详细讲解这三个技术以及它们在个人博客中的应用。 1. HTML ...

    一个综合运用flash,photoshop,javascript等知识的博客网站

    JavaScript还可以与Ajax技术结合,实现无刷新页面更新,提升用户体验。 描述中提到的“包括音乐,日记,相册,留言等”表明这个博客网站具有多种功能模块。音乐播放可能通过JavaScript实现,例如使用音频API创建...

    Javascript 特效 - 放大镜

    `ImageZoom.js` 可能会监听鼠标移动事件,当用户将鼠标悬停在主图上时,计算出鼠标的相对位置,以便在小窗口中显示相应的放大区域。 `CJL.0.1.min.js` 可能是一个压缩过的库文件,可能包含了辅助函数或工具,用于...

    Android创建UI的新思路:用javascript与Activity进行交互毕业设计—(包含完整源码可运行).zip

    - **性能优化**:虽然JavaScript可以提供丰富的UI效果,但过多的JavaScript操作可能会影响性能。合理地平衡原生代码与JavaScript的使用,可以提高应用的响应速度。 4. **项目结构** - **资源文件**:包含HTML、...

    Magic Notes App in JavaScript with Source Code.zip

    "Magic Notes App" 是一个基于JavaScript编写的笔记应用,它旨在提供一个简单、高效的平台,帮助用户记录、管理和分享他们的想法。通过深入理解这款应用的源代码,我们可以了解到JavaScript在构建Web应用方面的强大...

    PHP实例开发源码-emlog大前端模板SEO 优化版.zip

    优化版模板可能包括了CSS和JavaScript的合并与压缩,减少HTTP请求,优化图片大小等方式来提高页面加载速度。快速的加载速度能提升用户体验,也是搜索引擎排名的重要指标。 此外,响应式设计也是现代网页必备的特性...

    Titanic一组动画图标javascript库的集合

    此外,还可以通过JavaScript API动态添加和控制动画效果,增强页面的动态交互性。 5. **响应式设计**: Titanic图标库支持响应式设计,这意味着图标会根据屏幕尺寸自动调整大小,保证在移动设备和桌面设备上都有...

    鲁班H5页面生成工具 v1.17.0.zip

    此外,该工具可能还支持自定义CSS样式和JavaScript脚本,允许有编程基础的用户深入调整页面的视觉效果和交互逻辑。 对于源码源代码爱好者,鲁班H5页面生成工具可能还提供了导出源代码的功能。这意味着用户可以查看...

    餐厅网站的响应式3D菜单概念。这个想法是将菜单显示为折叠的传单并将其展开以显示菜单项_JavaScript_下载.zip

    考虑到移动设备的触摸特性,可能还需要优化触摸事件的处理,以保证在触摸屏上的操作流畅。 总结来说,"餐厅网站的响应式3D菜单概念"是一个集创新设计与实用功能于一身的项目,它结合了HTML、CSS和JavaScript的技术...

    JavaScript_一个快速、简单、强大的博客框架,由Nodejs提供支持.zip

    了解了JavaScript和Hexo的基本概念后,你可以利用这个压缩包快速搭建一个属于自己的个人博客,尽情展示你的想法和技术分享。无论是初学者还是经验丰富的开发者,JavaScript和Hexo都是创建动态、个性化博客的理想选择...

    web页面数据展示新想法(json)

    在使用JSON格式时,客户端JavaScript可以将获取的数据动态绑定到页面元素上,而无需重新加载整个页面。这种“无刷新”的数据更新方式提升了用户体验。 另外,使用JSON后,服务器端需要生成的数据量会减少,因此...

    ArcGIS API for JavaScript v4.13 离线库文件与官方文档.rar

    **ArcGIS API for JavaScript v4.13 离线库文件与官方文档** ArcGIS API for JavaScript 是Esri公司开发的一款强大的Web GIS开发工具,...通过深入理解和实践,开发者可以充分利用这个强大的API来实现自己的创新想法。

    【网页设计作业】摄影资源后台管理系统页面设计

    1. 前端技术:可以使用HTML5、CSS3和JavaScript(例如jQuery库)进行页面结构、样式和交互的构建,同时考虑响应式设计,确保在不同设备上良好显示。 2. 后端技术:可采用PHP、Python或Node.js等后端语言,搭配MySQL...

    V2EX社区论坛微信小程序源码+截图

    微信小程序主要由WXML(WeiXin Markup Language)负责结构层描述,WXSS(WeiXin Style Sheets)负责样式,JS(JavaScript)负责逻辑层,以及JSON配置文件定义页面的全局属性。 2. **V2EX社区论坛**:V2EX是一个技术...

    小个N烂的小网站

    8. **个人博客系统**:“小个N烂的小网站”可能是个个人博客,博主分享自己的想法、经历或者专业知识,这种情况下,网站架构可能基于博客模板或框架。 9. **自定义域名与托管**:网站可能有自己的独立域名,并在...

    JavaScript中document.referrer的用法详解

    总结起来,`document.referrer` 是JavaScript中一个非常重要的属性,它提供了当前页面的来源信息,这对于优化用户体验、数据分析以及安全性等方面都有重要应用。在实际开发中,我们应该充分利用这一特性,以提供更加...

    web网页设计期末课程大作业 HTML+CSS+JavaScript重庆火锅(代码质量好)

    4. **团队合作**:如果可能的话,与其他同学一起完成这个项目,这样可以通过交流和讨论获得更多的灵感和想法,同时也可以提高团队协作的能力。 5. **持续更新与优化**:前端技术发展迅速,因此即使完成了当前的项目...

    基于Web的影院购票小程序的设计与实现.pdf

    6. Ajax技术:Asynchronous JavaScript and XML,是一种允许网页异步更新的技术,无需重新加载整个页面即可获取数据或提交数据。它极大地提升了用户界面的响应速度和交互体验。 7. MongoDB:是一个高性能、开源且...

Global site tag (gtag.js) - Google Analytics