• 跨终端Web


    1、终端vs设备

    H5页面运行在同一设备的不同终端下。

    (1)Web浏览器。

    (2)微信、QQ浏览器。

    (3)移动App的Webview。

    (4)TV机顶盒。

    2、跨终端的实现方式

    (1)响应式

              存在内在的高耦合性,频繁更新维护成本高

    (2)多站点

           m.example.com、hd.example.com、

           wap.example.com、 iphone.example.com、

           ipad.example.com

    (3)多模板

           一个页面只有一个URL,无须服务器端繁杂的URL映射和终端检测等手段进行跳转。

    (4)多平台

               NativeApp,性能高,系统功能丰富。

     总结:多种方式结合。

    3、HTML5新特性

    (1)语义(header、footer、nav)

    (2)离线&存储(LocalStorage、IndexedDB、FileAPI)

    (3)设备访问(定位、语音输入、传感器)

    (4)网络连接(WebSocket、服务器信息推送)

    (5)多媒体(video、audio)

    (6)图形接口(canvas提供2D和3D的GDI,WebGL硬件加速)

    (7)性能&整合(WebWorkers实现脚本后台运行)

    (8)CSS3特性(Flex盒子模型、动画、投影、圆角、媒体查询、语音)

    4、通用触屏事件

    (1)拍击(Tap)

    (2)滑动(Swipe)

    (3)拖拽(Drag)

    (3)捏(Pinch)

    (4)旋转(Rotate)

    (5)重力感应(Shake)

    5、操作系统及浏览器分级

    (1)操作系分统级

    A级:IOS9.x、IOS8.x、IOS7.x 、Andriod4.4.x、 Andriod4.3.x、

               Android2.3.x

    B级: IOS6.x、 Andriod4.1.x、 Andriod4.0.x

    C级: IOS5.x、WindowsPhone

    (2)浏览器分级

    A级:APP客户端、微信、IOS&Andriod内置浏览器、UC浏览器、

          QQ浏览器

    B级:Chrome、360浏览器、Opera、IE10、猎豹、遨游、

    C级:Firefox、淘宝浏览器、NodeJS、TV机顶盒

    6、IF接口流程复用架构

    7、Hybrid APP

    (1)优点

           跨平台、快速发布、高效开发、丰富的DeviceAPI

    (2)缺点

              GPU/CPU密集类应用,比如游戏,性能不够高。可以通过

          “CSS Transform 3D”、Canvas硬件加速来缓解

           静态资源加载慢,可以通过Natite预加载进行拦截  

    (3)框架

              PhoneGap(Web App框架)

              Titanium(JS原生 App框架)

              React Native(Facebook App框架)

    8、前端MVC、NodeJS、Bootstrap

    (1)BackboneJS

    (2)AngularJS

    (3)NodeJS

    (4)Bootstrap

  • 相关阅读:
    HTTP content-type及POST提交数据方式
    Spring Kafka
    Spring动态数据源-AbstractRoutingDataSource(实现分库分表)
    HTTP通信安全和Web攻击技术
    HTTP协议
    zookeeper 图形化的客户端工具:ZooInspector
    centos 中v2r客户端配置实例
    查看视频详细信息
    centos7 创建用户
    logstash
  • 原文地址:https://www.cnblogs.com/ssol/p/4991457.html
Copyright © 2020-2023  润新知