• 红包项目总结---传统版


    效果

      线上:  微信关注苏宁易购红包,点发红包进去(已结束)

         线下:   浏览器打开以下地址:(部分看不到数据是因为需跑在微信上,通过微信鉴权)

        领群红包
        http://sale.suning.com/images/advertise/001/hb/getgrouphb.html?activityFlag=1
        http://sale.suning.com/images/advertise/001/hb/getgrouphb.html?activityFlag=2
        http://sale.suning.com/images/advertise/001/hb/getgrouphb.html?activityFlag=3
        http://sale.suning.com/images/advertise/001/hb/getgrouphb.html?activityFlag=4
        http://sale.suning.com/images/advertise/001/hb/getgrouphb.html?activityFlag=5
        http://sale.suning.com/images/advertise/001/hb/getgrouphb.html?activityFlag=6

        领子红包
        http://sale.suning.com/images/advertise/001/hb/gethb.html?status=0
        http://sale.suning.com/images/advertise/001/hb/gethb.html?status=1

        我的红包
        http://sale.suning.com/images/advertise/001/hb/myhb.html

        红包详情
        http://sale.suning.com/images/advertise/001/hb/hbdetail.html

      特征
        兼容各种智能手机、ipad、pad上的微信 

      效益

               为苏宁易购从每天带来数十万的新用户注册量到现在几百

    亮点

            


        原因:

         集成方案: fis进行合并压缩、MD5编码。gulp进行HTML压缩。fis,gulp配置文件看源码。

    项目关键点

      响应式
         无差别适应所有手机、ipad等

                原理:

                     浏览器加载时设置HTML/BODY 的fontsize。基准值。 其他一律用rem。

                流程:

                       

              图片:

                     做3套图 <=320  320~480  480~640。adapt.js给body设置自定义属性,通过自定义属性,加载不同路径的图。

                     实际未这么做。因为PNG太大了,1M多。最低只能压缩到200多K。最后我整张做成JPG,压缩到70K左右。

      应用程序框架
          特征: 人为约束业务渲染,全局静态类隐式分层
          架构:

             
          service类:  流程约束。
          模块化框架: 无
          DOM库: jquery

                     异常: dao层 jquery自带error。

                     日志: 无
          适应场景      1-2人。wap小型项目。红包这种。
          优点            前期直接编码。不需做任何准备。通过集成方案,性能也有一定保障。开发时随心所欲。   
          缺陷            维护性很低。

      集成方案

                      fis、gulp

                      步骤
                           1,进入到红包目录 

            2,fis release -ompDd ../hb
            3,删掉css、js目录代码
            4,html界面 移动adapt.js的内嵌代码到body开始标签下。
            5,gulp压缩html代码 

                     原因

                           为什么打包需要这么多步骤?  1,fis本身问题,它不能保证内嵌代码、合并代码、CDN三者在HTML上原来的位置,所以需要挪移。2,我偷懒,象3、5它应该能解决。


      性能   

    项目明显缺陷

            1,埋点未加aysnc,会导致首屏页面出来了,还在加载。应该用JS包装,保证最后异步,且延迟100MS上加载。

               

              2,jquery改成zepto

              3,可维护性太低,不适合协作。这是我一直单独做红包的原因。

    源码

      github上下载

  • 相关阅读:
    博弈基础小结
    P4677 山区建小学|区间dp
    两道DP,四年修一次路
    每天一套题打卡|河南省第七届ACM/ICPC
    nyoj 1278G: Prototypes analyze 与 二叉排序树(BST)模板
    表达式求值
    每天一套题打卡|河南省第八届ACM/ICPC
    每天一套题打卡|河南省第九届ACM/ICPC
    每天一套题打卡|河南省第十届ACM/ICPC
    [UNIX]UNIX常用命令总结
  • 原文地址:https://www.cnblogs.com/mominger/p/4224295.html
Copyright © 2020-2023  润新知