• 【读书笔记】iOS-优化iOS Web应用


    一,代码优化:

    代码优化是任何优化技术的第一步,因为归根结底网页上的一切都是构建在代码之上的。优秀的代码可以节省宽带,减少渲染延迟,以及提高页面的可读性和长远的可维护性。下面列出了一些在Web应用中编写任何代码时都应该记住的最佳实践。

    1,使用遵循Web标准的代码。

    2,精简代码。

    3,减少HTTP请求数。

    1)单个资源文件必须少于15KB(在未缩的情况上)。

    针对iPhone设计的页面需要将各个资源文件的大小限制在15KB以内,以得到最优的缓存行为。iPhone最多可以缓存105个15KB以下的资源文件。在达到缓存数量上限以后,新缓存的文件会覆盖缓存中的旧的文件。

    2)全局缓存资源必须少于1.5KB.

    尽管iPhone能够缓存很多资源文件,但加起来最多只能缓存大概1.5MB.缓存可用字节数的上限大约为105*15=1575KB.

    3)设备关机会后清空HTTP缓存。

    如果用户需要强制重启设备,缓存中的资源就会丢失。这是由于在iPhone上,Safari从系统内存中分配空间来创建缓存文件,但并没有把缓存组件写入持久性的存储设备中。

    4)关闭标签页也会清空HTTP缓存。

    关闭掉所有标签,只留下空白标签后再关掉Safari也会清空缓存。

    从开发的视角来看,这种类型的缓存是不可靠的。因为它清空的频率太高,也难以缓存一个现代网页的大部分资源。即便是压缩到极致的JavaScript框架或CSS文件都很难将大小控制在15k以内,更不用说几乎所有的Web应用用到的图片都会超过这个大小。万幸的是我们还有更好的选择来实现目标,即HTML5提供的离线功能。

    4,合并CSS和JavaScript文件。

    5,减少DOM操作。

    二,图片优化。

    1,优化色彩深度。

    2,使用CSS精灵图。

    3,千万不要缩放图片。

    始终根据设备视口或是设计元素的宽高来以合适的尺寸使用图片。别指望Safari能自动把一个图片缩放到合适的大小。唯一可以例外的是,当我们在指定设备的Web应用中插入图片时,可以通过设置值为100%的宽度来同时自适应于横屏或是竖屏视图。

    这一法则同样也可以缩短网页的加载时间及页面中每次运行JavaScript时给用户体验造成的延时,遵守这一法则非常重要,同时也别忘了给图片设定宽度和高度,这样也助于减少渲染所用的时间。这一法则同样缩短了网页的加载时间以及页面中每次运行JavaScript时给用户体验造成的延时。

    三,应用压缩。

    Safari支持GZIP压缩,所以将Web应用的一些资源进行压缩会是个不错的想法,这样可以提升用户体验的层次。我们可以决定什么时候 压缩HTML5页面,CSS3样式表或是JavaScript代码,然而却并没有必要去压缩图片或者是PDF文档,因为这些类型的资源是已经压缩过的。对图片或者PDF文档进行压缩是白白浪费CPU资源,甚至有可能反而增大文件体积。

    对于服务器来说,为了使用Web应用能使用GIP压缩过的资源,服务器必须配置为在请求时自动提供压缩过的资源。另外一方面,客户端必须支持这种压缩类型的文件。

    GIP压缩并不骨文件格式的限制,因此这是给网页大幅”瘦身“的最简易的方式。GZIP压缩可以将文件减少大概70%。

    虽然好处很明显,但世界上没有十全十美,一般而言GZIP压缩也有一些不足之外。

    1,我们需要个个支持GZIP压缩的浏览器。当然,针对我们的情况这并不是一个问题,因为Safari和其他基于WebKit的浏览器都支持GZip.

    2,  我们无法压缩力片和PDF文档,因为它们本身就是一种压缩格式。

    3,由于Safari需要实时地解压缩资源,某些情况下这一过程会增加CUP时钟周期和开销,以致抵消了可能带来的好处。所以,最好先测试一下,以确保不会被这些额外开销造成弊大于利的情况。

    四,可用性优化。

    1,可用性检查。

    2,可用性测试。

     

     

    参考资料:《iOS Web应用开发》

  • 相关阅读:
    复杂系统架构设计<1>
    DevExpress Applications<3>
    DevExpress Skins<2>
    DevExpress MVVM<1>
    Unity容器<1>
    spring cloud微服务快速教程之(九) Spring Cloud Alibaba--sentinel-限流、熔断降级
    spring cloud微服务快速教程之(八) Spring Cloud Alibaba--nacos(二)、配置中心
    spring cloud微服务快速教程之(七) Spring Cloud Alibaba--nacos(一)、服务注册发现
    小白的springboot之路(十五)、mybatis的PageHelper分页插件使用
    spring cloud微服务快速教程之(六) 应用监控 spring boot admin
  • 原文地址:https://www.cnblogs.com/yang-guang-girl/p/8460787.html
Copyright © 2020-2023  润新知