《WebKit技术内幕》学习之十五(3): Web前端之未来

3 Web应用和Web运行环境

3.1 Web应用

        HTML5提供了强大的能力,而不是支持Web网页这么简单。就目前而言,它已经初步提供了支持Web网页向Web应用方向发展的能力。相对于本地应用(Native Application),Web前端领域也能够提供编写应用程序的能力了。前面提到了移动领域是HTML5重点关注的一个方向,在W3C中,甚至成立了一个工作组专门跟踪和关注移动领域Web应用所需要各项技术的进展情况:http://www.w3.org/2013/06/mobile-web-app-state/。

        很多技术对于Web网页和Web应用是共享的,如基础渲染工作、Canvas2D、WebGL、CSS、音视频等,但是还有众多的技术是为Web应用设计的,如Web manifest规范、运行模型规范等。

        根据W3C规范的定义,可以将Web应用分成两种类型,第一种称为Packaged Application,也就是该应用包含了自身所需要的所有资源,包括HTML、CSS、JSS及各种图片等资源,这意味着该应用不需要网络就能运行。第二种称为Hosted Application,不是Packaged Application类型的应用都属于此类,所以也就是说它包含了一些外部的资源。为什么会如此划分?主要是针对需求和安全方面的考虑,后面会介绍到。

        在一些应用场景下需要Packaged Application类型,第一是因为应用市场的需要,很多市场需要审核应用使用哪些权限,而不是无限制地使用任何平台提供的能力,这点对于安全性尤为重要。第二是因为开发者的需要,使用Web前端和HTML5技术开发并不意味着需要提供服务器并把Web应用布置在服务器上。像本地应用一样,Web应用也能够独立地工作。第三是因为用户的需要,很多时候用户希望在离线情况下仍然能够使用该应用,不要像很多本地应用一样,一旦离线就不能使用,这点对于用户体验是个考验,对于中国等市场尤其重要。

        与普通网页不同的是,一个Web应用通常包含一个称为清单(Manifest)的文件,该文件的目的跟很多系统如Android上的应用程序的清单文件类似,就是为了定义该应用的一些信息。示例代码15-1是一个Web应用的简单清单文件,参考了W3C官网的一些说明,并做了一些修改。

        一个清单文件实际上是一个JSON(JavaScript Object Notation)格式的文件,它主要是属性和属性值的配对,该类文件是由W3C的规范来定义的,示例代码15-1中列出了一些基本的属性和属性值,下面逐次来分析和理解它们。

示例代码15-1 一个简单的清单文件

    {
      "name": "WebKit技术内幕",
      "description": "介绍WebKit内部技术和原理",
      "launch_path": "/index.html",
      "version": "0.1",
      "icons": {
        "16": "/img/icon.png",
      },
      "screen_size": {
        "min_width": "600",
        "min_height": "600"
      },
      "fullscreen": "true",
      "required_features": ["touch", "geolocation", "webgl"],
      "permissions": {
        "contacts": {
          "access": "read"
        }
      },
    }

        首先是应用基本信息的设置,包括名称“name”、描述“description”、加载入口文件“launch_path”、版本“version”、图标“icons”(规范甚至允许设置多个不同分辨率的图片)、窗口大小“screen_size”、全屏“fullscreen”。之后是该应用需要使用的功能和权限,它们的区别在于权限是系统中的一些非常敏感的信息,如个人信息,包括但是不限于通讯录、位置、文件系统等。

        当然规范中定义的属性远远不止这些,清单的规范也在不断发展,以后可能会做一些修改,并在未来引入更多的设置信息。这样,Web应用看起来就越来越像本地应用了。

3.2 Web运行环境

        Web应用需要有支撑的运行环境才能够工作,就像本地应用需要操作系统才能工作,所以能够支撑Web应用运行的平台或者运行环境,称为Web运行环境(也可以叫Web平台)。那么一个Web运行环境包含哪些功能或者特性呢?

        图15-3描述了Web运行平台的功能及其与Web应用的关系,下面逐次来分析它们。

图15-3 Web运行平台功能和Web应用

  • 首先是运行HTML5功能的能力 :Web运行平台当然能够支持众多HTML5功能,包括基本功能如CSS、JavaScript、Canvas2D等,同时也必须包括访问设备的能力,典型能力如设备信息、地理位置信息、加速传感器、摄像头等。
  • 其次是对(离线)存储的要求 :因为Web应用需要能够访问文件系统或者使用大量的存储空间,特别是离线应用,这里面包括离线缓存、文件系统、文件操作接口等方面的规范支持,这些对于应用特别重要。
  • 再次是将Web资源文件打包的支持 :也就是将HTML/CSS/JavaScript文件和其他资源文件生成一定格式的包,这里面重要的一点就是对清单的支持。清单描述了Web应用的基本设置,这些设置对于网页而言是不需要的,但是Web应用需要这些来定义它作为一个应用程序的行为,如前面说的全屏、窗口大小、图标等。
  • 然后是应用程序的运行模式 :也就是生命周期方面的支持。Web运行环境能够通知Web应用启动、挂起、恢复和销毁等状态信息。这个是区别于网页的重要特征之一。
  • 最后是能够启动并运行Web应用 :是的,这可以让Web应用使用起来跟本地应用的体验相同或者类似,而不仅仅是网页浏览的方式,这里面包括开启应用、关闭应用、升级应用和管理应用等。

        虽然都能支持Web应用,但是Web运行环境也是多种多样的。按照Web运行环境的工作模式,目前可以将它分成三种类型。

  • 操作系统本身就支持Web应用,所以通常称为Web操作系统,典型的例子如Tizen、Chrome OS、Firefox OS等。因为整个操作系统就是为了Web应用设计的,所以Web应用在系统中是第一等公民。
  • 浏览器或者其他类似的产品中包含支持Web应用的能力,典型的例子是Crosswalk的Tizen版(英特尔公司的开源项目)、Chromium的桌面版和Pokki等。这一类型的特性是Web应用都是由该运行环境管理,操作系统看不到Web应用的存在,而且每个Web应用也不会都变成一个本地应用。因为本身操作系统只是支持本地应用,所以Web应用对操作系统而言是透明的,它看到的是多个运行环境中的实例。
  • 以一个独立的框架存在于传统的操作系统,本来Web运行环境依赖于操作系统才能运行,而Web应用工作在该Web运行环境中,就像本地应用一样,所以操作系统不能感知它是本地应用还是Web应用,典型的例子如Crosswalk(Android版)和Cordova(也就是PhoneGap使用的开源项目)。它同第二类型的区别在于,Web应用本身会被打包成本地应用,所以操作系统认为每个打包后的Web应用就是一个本地应用,每个Web应用之后的启动方式跟本地应用相同,当然,Web应用是由Web运行环境这个本地应用启动并运行的。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/351994.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

NIO-Selector详解

NIO-Selector详解 Selector概述 Selector选择器,也可以称为多路复⽤器。它是Java NIO的核⼼组件之⼀,⽤于检查⼀个或多个Channel的状态是否处于可读、可写、可连接、可接收等。通过⼀个Selector选择器管理多个Channel,可以实现⼀个线程管理…

深入浅出AI落地应用分析:AI视频生成Top 5应用

接下俩会每周集中体验一些通用或者垂直的AI落地应用,主要以一些全球或者国外国内排行较前的产品为研究对象,「AI 产品榜: aicpb.com」以专题的方式在博客进行分享。 一、Loom 二、Runway 产品链接:https://app.runwayml.com/ …

企业职能部门员工忙闲不均,如何调动积极性?

案例企业背景: 某企业隶属于中国航天科技集团公司,致力于光纤陀螺系统、微机电惯性系统、光纤传感系统等高新技术产品的研发。公司具有雄厚的新型惯导和光电传感技术基础,多年来开创了我国光纤陀螺技术在武器、卫星和载人飞船等多个任务上的…

代码随想录Day32 | 122.买卖股票的最佳时机II 55. 跳跃游戏 45.跳跃游戏II

代码随想录Day32 | 122.买卖股票的最佳时机II 55. 跳跃游戏 45.跳跃游戏II 122.买卖股票的最佳时机II55.跳跃游戏45.跳跃游戏II 122.买卖股票的最佳时机II 文档讲解:代码随想录 视频讲解: 贪心算法也能解决股票问题!LeetCode:122.…

【笔记】顺利通过EMC试验(16-41)-视频笔记

目录 视频链接 P1:电子设备中有哪些主要骚扰源 P2:怎样减小DC模块的骚扰 P3:PCB上的辐射源究竟在哪里 P4:怎样控制PCB板的电磁辐射 P5:多层线路板是解决电磁兼容问题的简单方法 P6:怎样处理地线上的裂缝 P7:怎样降低时钟信号的辐射 P8:为什么IO接口的处理特别重要 P9…

ARIMA模型:Python实现

ARIMA模型:Python实现 自回归移动平均模型(ARIMA)是一种经典的时间序列分析和预测方法。前期已介绍了ARIMA的概念和公式,本文将介绍ARIMA模型的理论基础,并提供详细的Python代码实现,帮助读者了解如何应用…

VS生成报错:MSB8036 The Windows SDK version 8.1 was not found.找不到 Windows SDK 版本 8.1

目录 一、查看本机SDK二、 解决法一:适配本电脑的SDK法二:下载SDK 8.1 VS生成报错:MSB8036 找不到 Windows SDK 版本 8.1。请安装所需版本的 Windows SDK,或者在项目属性页中或通过右键单击解决方案并选择“重定解决方案目标”来更…

用ChatGPT写申请文书写进常春藤联盟?

一年前,ChatGPT 的发布引发了教育工作者的恐慌。现在,各大学正值大学申请季,担心学生会利用人工智能工具伪造入学论文。但是,聊天机器人创作的论文足以骗过大学招生顾问吗? ChatGPT简介 ChatGPT,全称聊天生…

C++ 之LeetCode刷题记录(二十)

😄😊😆😃😄😊😆😃 开始cpp刷题之旅。 依旧是追求耗时0s的一天。 110. 平衡二叉树 给定一个二叉树,判断它是否是高度平衡的二叉树。 本题中,一棵高度平衡二…

构建外卖跑腿系统:技术实现与架构设计

在当今数字化时代,外卖跑腿系统已成为人们生活中不可或缺的一部分。本文将探讨如何利用先进的技术和架构设计,开发一个高效、可靠的外卖跑腿系统。 1. 技术选型 在开发外卖跑腿系统之前,我们需要仔细选择适合的技术栈,以确保系…

[C++13]:stack queue priority_queue 模拟实现

stack && queue && priority_queue 模拟实现 一.stack1.概念:2.使用:3.模拟实现:一些题目:1.最小栈:2.栈的压入弹出序列:3.逆波兰表达式求值: 二.queue1.概念:2.使用…

SpringBoot之时间数据前端显示格式化

背景 在实际我们通常需要在前端显示对数据操作的时间或者最近的更新时间,如果我们只是简单的使用 LocalDateTime.now()来传入数据不进行任何处理那么我们就会得到非常难看的数据 解决方式: 1). 方式一 在属性上加上注解,对日期进行格式…

Web3 游戏开发者的数据分析指南

作者:lesleyfootprint.network 在竞争激烈的 Web3 游戏行业中,成功不仅仅取决于游戏的发布,还需要在游戏运营过程中有高度的敏锐性,以应对下一次牛市的来临。 人们对 2024 年的游戏行业充满信心。A16Z GAMES 和 GAMES FUND ONE …

探索IOC和DI:解密Spring框架中的依赖注入魔法

IOC与DI的详细解析 IOC详解1 bean的声明2 组件扫描 DI详解 IOC详解 1 bean的声明 IOC控制反转,就是将对象的控制权交给Spring的IOC容器,由IOC容器创建及管理对象。IOC容器创建的对象称为bean对象。 要把某个对象交给IOC容器管理,需要在类上…

深度学习知识

context阶段和generation阶段的不同 context阶段(又称 Encoder)主要对输入编码,产生 CacheKV(CacheKV 实际上记录的是 Transformer 中 Attention 模块中 Key 和 Value 的值),在计算完 logits 之后会接一个Sampling 采…

【MySQL进阶】InnoDB引擎存储结构和架构

文章目录 逻辑存储结构架构内存结构Buffer Pool&Adaptive Hash IndexChange BufferLog Buffer 磁盘结构 逻辑存储结构 表空间(Tablespaces):InnoDB使用表空间来管理存储表和索引的数据文件。每个表空间包含一个或多个数据文件&#xff0c…

【学网攻】 第(9)节 -- 路由器使用以及原理

系列文章目录 目录 系列文章目录 文章目录 前言 一、路由器是什么? 二、实验 1.引入 总结 文章目录 【学网攻】 第(1)节 -- 认识网络【学网攻】 第(2)节 -- 交换机认识及使用【学网攻】 第(3)节 -- 交换机配置聚合端口【学网攻】 第(4)节 -- 交换机划分Vlan…

解锁一些SQL注入的姿势

昨天课堂上布置了要去看一些sql注入的案例,以下是我的心得: ​​​​​​​ ​​​​​​​ ​​​​​​​ 1.新方法 打了sqli的前十关,我发现一般都是联合查询,但是有没有不是联合查询的方法呢&#xf…

Python基础学习 -05 基本类型

Python3 基本数据类型 Python 中的变量不需要声明。每个变量在使用前都必须赋值,变量赋值以后该变量才会被创建。 在 Python 中,变量就是变量,它没有类型,我们所说的"类型"是变量所指的内存中对象的类型。 等号&…

Nodejs前端学习Day1_补档

我给day1搞没了,还是觉得该补一个,有用 文章目录 前言一、学习目标二、学习目录三、为什么JavaScript代码可以在浏览器中运行四、为什么JavaScript可以操作DOM和BOM五、浏览器中的JavaScript运行环境总结 前言 补档 一、学习目标 二、学习目录 三、为什…