web app 的技术参考 -- 来自 【百度移动建站指南】

简介:

优化页面性能


  考虑到移动设备和移动互联网的特点,在进行移动网站的页面开发设计时,一个总的原则是考虑用户访问的效率, 降低页面加载时间
 下面的内容来自百度,然后我自己做了笔记。另外可参考 这个系列的文章

减少访问请求数

  • 从设计实现层面简化页面,不要放太多的图片、复杂的表达、动画、视频等等。
这个好理解,二进制数据太占流量。

 

  • 资源合并及压缩:比如将背景图片、导航图片等等作为一张图片,这样只需一次请求,而不是多次。
资源合并,只用一次请求,解决问题。 压缩,是将文件大小降低,比如css,js去空白。
至于压缩,涉及到的内容较为复杂一些:参考《 用 HTTP 压缩加快 Web 数据的发送》《 配置Tomcat,Apache的gzip压缩(HTTP压缩)来提高浏览网站速度》《 【HTTP】Fiddler(一) - Fiddler简介

 

  • 静态资源(Css、Js、Image)懒加载

参考一下这篇文章《让我们再聊聊浏览器资源加载优化

 

  • 异步执行inline脚本

不懂,网上东西也不多,后续跟进。

  • 避免重复的资源请求

最常见的就是,jQuery引用了好几次。

  • 缩小cooike

为什么呢?宽带占得过多,还是很消耗资源?

  • 设置连接方式为keep-alive

谈HTTP的KeepAlive

  • 减少DNS查询

优化网站设计(九):减少DNS查找的次数

  • 移动端可见区域是有限的,采用延迟加载方式

和上面“静态资源(Css、Js、Image)懒加载”有什么区别

  • 开启服务器压缩(gzip方式)
上面已经说过,有点多余了
 
 
 

优化图片处理

  1. 图片走CDN
  2. 少用动态gif图
  3. 图片不适宜过多及过大
  4. 零碎图片使用css Sprite技术一次性下载
  5. 避免使用bmp图片
  6. 图片压缩
1. 要钱。 2.3.5.6 可以在后台用插件控制图片上传的规格
 
 

优化HTML

  1. 减少HTML标签,减少不必要的嵌套
  2. 废弃table标签
  3. 减少DOM深度
  4. 压缩HTML,去掉注释,空格换行等信息
  想起了阮老师的《 也许,DOM 不是答案
 
 

优化JS

  1. 使用临时变量或者数组存储document.images及document.forms等集合数据
  2. 慎用with语法
  3. 使用AJAX缓存
  4. 避免eval及Function语法
  5. 避免使用inlineScript
  6. 异步、底部加载js
  7. 合并压缩js
  8. 字符串连接使用数组的join方式

本文转自二郎三郎博客园博客,原文链接:http://www.cnblogs.com/haore147/p/5489802.html,如需转载请自行联系原作者
相关文章
|
17天前
|
前端开发 JavaScript 关系型数据库
从前端到后端:构建现代化Web应用的技术探索
在当今互联网时代,Web应用的开发已成为了各行各业不可或缺的一部分。从前端到后端,这篇文章将带你深入探索如何构建现代化的Web应用。我们将介绍多种技术,包括前端开发、后端开发以及各种编程语言(如Java、Python、C、PHP、Go)和数据库,帮助你了解如何利用这些技术构建出高效、安全和可扩展的Web应用。
|
1月前
|
前端开发 数据库 UED
构建高性能Web应用的关键技术
本文将介绍构建高性能Web应用的关键技术,包括前端优化、后端优化、数据库优化等方面。通过深入讨论各项技术的原理和实践方法,帮助开发者们提升Web应用的响应速度和用户体验。
|
1月前
web端接入百度统计
web端接入百度统计
66 0
|
1月前
|
存储 前端开发 JavaScript
从前端到后端,探索现代Web开发技术
本文探索了现代Web开发技术的各个方面,包括前端和后端开发以及多种编程语言的应用。通过对JavaScript、Java、Python、C、PHP和Go等语言的介绍,深入探讨了前端和后端开发的基本原理和常用工具。同时,还涵盖了数据库技术在Web开发中的重要性和应用场景。无论你是初学者还是有经验的开发者,本文都能为你提供全面的视角和实用的知识,帮助你在Web开发领域取得更好的成果。
|
1月前
|
前端开发 开发者
探索前端技术的新趋势:Web组件化开发
【2月更文挑战第11天】 在这篇文章中,我们将深入探讨Web组件化开发的概念及其对前端开发领域的影响。不同于传统的摘要方式,我们通过一个故事来引入主题:想象在一个快速变化的数字世界里,有一座由各种小型、独立、可复用的建筑块构成的城市,每个建筑块都拥有独特的功能和风格,它们可以自由组合,创造出无限可能的城市景观。这座城市,就像是使用了Web组件化开发技术的前端项目。接下来,我们将详细探讨Web组件化开发的优势、实现方式以及面临的挑战,为前端开发者提供一个全面的视角来理解和应用这一重要的技术趋势。
62 5
|
1月前
|
SQL 存储 数据库
基于Web技术的在线考试系统的设计与实现(论文+源码)_kaic
基于Web技术的在线考试系统的设计与实现(论文+源码)_kaic
|
1月前
|
网络协议 安全 网络性能优化
基于web技术的企业网设计与实现_kaic
基于web技术的企业网设计与实现_kaic
|
1天前
|
前端开发 JavaScript UED
Web前端开发:探索技术与艺术的交融
Web前端开发:探索技术与艺术的交融
8 1
|
2天前
|
设计模式 存储 前端开发
Java从入门到精通:2.2.1学习Java Web开发,了解Servlet和JSP技术,掌握MVC设计模式
Java从入门到精通:2.2.1学习Java Web开发,了解Servlet和JSP技术,掌握MVC设计模式
|
23天前
|
数据采集 小程序 网络安全
云擎技术---分析工信部APP备案的“传闻”
APP备案并非新事物,自2005年起已有非经营性互联网信息服务备案制度。备案针对的是网站主办者,而非用户,不涉及个人用户网络访问。网络接入服务提供者包括ISP和IDC,不限于三大运营商。通知要求不为未备案网站提供接入,但不影响国外软件使用。个人开发者不能涉及经营性内容,备案审核时长1-20个工作日。境内服务器和国内应用商店需备案,境外则无需。手机厂商不会开启白名单制,仅实行黑名单制。APP备案与民营经济发展壮大意见不冲突,工信部有权颁布相关规定。该政策不存在逐步试探底线情况,所有解读均有法律依据。
25 3
云擎技术---分析工信部APP备案的“传闻”