继昨天全景实现后,再做了一个全景图切换实验;

code:https://github.com/Thinkia/threejs_/blob/master/test/test1-panorama/index2.html

demo:https://thinkia.github.io/threejs_/test/test1-panorama/index2.html

全景图切换性能实验图

Cpu响应时间消耗主要是两个全景图的切换过程中;

主要资源是图片资源的优化;

于是我试了了几个优化方案

  1. 图片切割解码后用canvas拼接
  2. Js,css 等压缩
  3. 把图片格式转换为webp;

还有一种canvas缓存的暂时还未实验

three.js 实现全景以及优化(2)的更多相关文章

  1. three.js 实现全景以及优化(1)

    实现一个三维全景;  然后思考优化问题; 于是我问了下webgl技术交流群朋友有啥解决方案; 对于krpano.js 的了解,只是知道百度全景用了这个技术; 最后还是选择了群友给出的three.js  ...

  2. 客户端JS性能的一些优化的小技巧

    下面是一些关于客户端JS性能的一些优化的小技巧:1.[顶]关于JS的循环,循环是一种常用的流程控制.JS提供了三种循环:for(;;). while().for(in).在这三种循环中 for(in) ...

  3. js资源加载优化

    互联网应用或者访问量大的应用,对js的加载优化是不可少的.下面记录几种优化方法 CDN  + 浏览器缓存 CDN(content delivery network)内容分发网络, 最传统的优化方式.其 ...

  4. JS日历控件优化(增加时分秒)

    JS日历控件优化      在今年7月份时候 写了一篇关于 "JS日历控件" 的文章 , 当时只支持 年月日 的日历控件,现在优化如下:      1. 在原基础上 支持 yyyy ...

  5. Vue.Js的用户体验优化

    一次基于Vue.Js的用户体验优化   一.写在前面 半年以前,第一次在项目上实践VueJs,由于在那之前,没有Angular,avalon等框架的实践经验,所以在Vue的使用上,没有给自己总结出更多 ...

  6. vue.js的app.js太大怎么优化?

    vue.js的app.js太大怎么优化? # http://nginx.org/en/docs/http/ngx_http_gzip_module.htmlgzip on;gzip_min_lengt ...

  7. 基于Three.js的全景---photo-sphere-viewer

    以前公司其他几个前端做全景都是用软件生成,由于本人比较懒,不想去折腾那个软件,于是乎就有了下面的事...... 这个是基于three.js的全景插件  photo-sphere-viewer.js  ...

  8. JS学习笔记12_优化

    一.可维护性优化 1.添加注释 注释能够增强代码的可读性以及可维护性,当然,理想情况是满满的注释,但这不太现实.所以我们只需要在一些关键的地方添上注释: 函数和方法:尤其是返回值,因为直接看不出来 大 ...

  9. 一次基于Vue.Js用户体验的优化

    .mytitle { background: #2B6695; color: white; font-family: "微软雅黑", "宋体", "黑 ...

随机推荐

  1. hadoop性能调优

    1.平衡磁盘利用率 hadoop balancer -Threshold 20 或者 sh $HADOOP_HOME/bin/start-balancer.sh –t 20% 参数20是比例参数,表示 ...

  2. CDN中前端层的复制

    前端层的复制是为了提高静态内容分发的性能和可扩展性.将静态内容的分发转由边缘服务器来完成是为了解决可扩展性的问题,因为这样做可以避免出现在对等点和广域网链路处的网络拥堵风险,而这两个地方的拥堵是网络延 ...

  3. APICloud ajpush(极光推送) 6009

    APICloud 其它的都按照APICloud的使用说明操作即可,但有一点需要提醒像我一样才接触的朋友:极光推送需打包测试,不能直接自定义Loader.否则,你会发现在绑定别名的方法时会一直返回&qu ...

  4. 新手福音︱正则表达式小工具RegExr

    由于之前在做NLP的内容,势必会接触正则表达式,但是呢,又觉得这个学不明白- 于是,这个工具还是蛮不错的,相当于在线正则速查+验证小工具,对于我这样的新手值得去玩玩. github:https://g ...

  5. 2.5 非透明PCI桥

    PCI桥规范定义了透明桥的实现规则,本篇在第2.3.1节中详细介绍了这种桥片.通过透明桥,处理器系统可以以HOST主桥为根节点,建立一颗PCI总线树,在这个树上的PCI设备共享同一个PCI总线域上的地 ...

  6. 解决 Cannot find OpenSSL's <evp.h> 和sasl.h not found!

    编译mongodb拓展出现 Cannot find OpenSSL's <evp.h> 解决方法:安装openssl yum install openssl openssl-devel 出 ...

  7. directX--关于CSource和CSourceStream (谁调用了fillbuffer)

    CSourceStream类,是CSource类的OutputPin[source.h/source.cpp]派生自CAMThread和CBaseOutputPinl         成员变量: CS ...

  8. 从Git到GitHub,详细教程

    众所周知,一个稍微有点规模的项目,都不可能是一个人单打独斗完成的(能完成的大神别打我),所以,一个高效的项目团队就需要一个NB的工具来进行有效的交流(曾经有人问我企鹅不就可以吗,我竟无言以对),今天就 ...

  9. CodeM资格赛 Round A 最长树链

    按照题解的做法,对于每一个质约数分别进行讨论最长链就行 对于每一个数的质约数可是比logn还要小的 比赛的时候没人写,我也没看 = =,可惜了,不过我当时对于复杂度的把握也不大啊 #include & ...

  10. poi 导入导出的api说明(大全)

    原文链接:http://www.cnblogs.com/qingruihappy/p/8443101.html poi 导入导出的api说明(大全) 一. POI简介 ApachePOI是Apache ...