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

news2024/11/17 4:24:11

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运行环境这个本地应用启动并运行的。

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

如何在yolov8中验证时计算FPS

ultralytics-main/ultralytics/engine/validator.py文件下,第200行左右,添加如下代码 LOGGER.info(fFPS:{(1000 / sum(self.speed.values())):.2f}) speed.values()是一个字典,包括preprocess,inference,loss,postprocess的时间,所…

SpringSecurity(15)——OAuth2密码模式

工作流程 将用户和密码传过去,直接获取access_token,用户同意授权动作是在第三方应用上完成,而不是在认证服务器,第三方应用申请令牌时,直接带用户名和密码去向认证服务器申请令牌。这种方式认证服务器无法判断用户是…

【python自动化系列01】Openpyxl,操作Excel文件的利器

如果要批量操作Excel文件,使用最广泛的是 Openpyxl 库。这个库集成了Excel的所有操作,从创建Excel、保存Excel到设置Excel单元格字体、颜色都可以实现。下面开始学习 Openpyxl 的简单使用吧!!! 安装 openpyxl 库 ope…

ensp winpcap无法安装

安装ensp的依赖软件winpcap无法安装 发现提示已有最新版本、找网上都是修改文件后缀名,测试后发现根本不行,有点扯 npcap是wireshark安装带的,通过卸载wireshark安装 ensp安装顺序应该先安装winpcap->wireshark->virtualbox->ens…

高中数学常识

一、大小关系 |x| > |sinx| 理由: 很明显,在圆内,弧长x>垂线sinx 3x、2x 、 1 2 \frac{1}{2} 21​x 理由: log 1 2 _\frac{1}{2} 21​​x、log 2 _2 2​x、 log 3 _3 3​x 二、(xy)? 的求法 利用二项式定理 三、平…

ThreadLocal内存泄漏示例

ThreadLocal内存泄漏是老生常谈的问题了,原理就不多说了,这里只简单回顾下 Thread类有个属性threadLocals,其实就是个map。 这个map的结构如下,key是ThreadLocal对象,是一个弱引用,value是调用threadLocal…

cmake工具的安装

1、简介 CMake 是一个开源的、跨平台的自动化建构系统。它用配置文件控制编译过程的方式和Unix的make相似,只是CMake并不依赖特定的编译器。CMake并不直接建构出最终的软件,而是产生标准的建构文件(如 Unix 的 Makefile 或 Windows Visual C …

ZYNQ AC7020C的“点LED”实验

一、创建 Vivado 工程 1、启动 Vivado 2、在 Vivado 开发环境里点击“Create New Project”,创建一个新的工程 3、弹出一个建立新工程的向导,点击“Next” 4、在弹出的对话框中输入工程名和工程存放的目录。需要注意工程路径“Project location”不能有…

安科瑞宿舍安全用电监测:科技保障,安全无忧

在当今社会,电力已成为我们日常生活中不可或缺的一部分。然而,不正确的用电方式或管理不善可能会引发火灾等安全事故,给学生带来生命财产威胁。为了解决这一问题,安科瑞宿舍安全用电监测系统应运而生,为学生的用电安全…

[每日一题] 01.27 - 斐波那契数列

文章目录 打分斐波那契数列 打分 n int(input()) lis list(map(int,input().split())) a sum(lis) - min(lis) - max(lis) print(round(a / (n - 2),2))斐波那契数列 n int(input()) res [] for i in range(n):res.append(int(input()))Max max(res) lis [1,1] for i in…

高精度加减乘除算法模板

高精度加减乘除算法模板 高精度加法算法模板模版题 高精度减法算法模板模版题 高精度乘法算法模板模版题 高精度除法算法模板模版题 高精度加法算法模板 首先,我们要知道高精度算法是C才用的,Java中是不需要高精度算法的 高精度加法: 两个大的…

K8S搭建(centos)二、服务器设置

天行健,君子以自强不息;地势坤,君子以厚德载物。 每个人都有惰性,但不断学习是好好生活的根本,共勉! 文章均为学习整理笔记,分享记录为主,如有错误请指正,共同学习进步。…

Spring MVC 请求流程

SpringMVC 请求流程 一、DispatcherServlet 是一个 Servlet二、Spring MVC 的完整请求流程 Spring MVC 框架是基于 Servlet 技术的。以请求为驱动,围绕 Servlet 设计的。Spring MVC 处理用户请求与访问一个 Servlet 是类似的,请求发送给 Servlet&#xf…

数据结构.线性表

1.静态分配 #include<iostream> using namespace std; const int N 10; typedef struct {int data[N];int length;}SqList; void InitList(SqList &L) {for (int i 0; i < N; i){L.data[i] 0;}L.length 0; }int main() {SqList L;InitList(L);return 0; }2.动…

实体关系抽取与属性补全的技术浅析

目录 前言1. 实体关系抽取2 实体关系抽取的方法2.1 基于模板的方法2.2 基于监督学习的关系抽取2.3 基于深度学习的关系抽取2.4 基于预训练语言模型的关系抽取 3 属性补全3.1 属性补全任务简介3.1 抽取式属性补全3.2 生成式属性补全 4 未来发展趋势结语 前言 在信息爆炸时代&am…

带延迟的随机逼近方案(Stochastic approximation schemes):在网络和机器学习中的应用

1. 并行队列系统中的动态定价Dynamic pricing 1.1 系统的表述 一个含有并行队列的动态定价系统&#xff0c;该系统中对于每个队列有一个入口收费(entry charge) &#xff0c;且系统运行的目标是保持队列长度接近于某个理想的配置。 这里是这个系统的几个关键假设&#xff1a;…

Spring boot + Azure OpenAI 服务 1.使用 GPT-35-Turbo

Azure OpenAI 服务使用 GPT-35-Turbo 先决条件 maven 注意 beta.6 版本 <dependency><groupId>com.azure</groupId><artifactId>azure-ai-openai</artifactId><version>1.0.0-beta.6</version></dependency>问答工具类 pack…

鸿蒙可视化代码生成器神器

ArkTS 语言 ArkTS是鸿蒙生态的应用开发语言。它在保持TypeScript&#xff08;简称TS&#xff09;基本语法风格的基础上&#xff0c;对TS的动态类型特性施加更严格的约束&#xff0c;引入静态类型。同时&#xff0c;提供了声明式UI、状态管理等相应的能力&#xff0c;让开发者可…

【Godot4自学手册】第七节背景搭建

各位同学&#xff0c;今天是第七节&#xff0c;在本节我会学习如何使用TileMap来完成背景搭建。 一、添加TileMap结点 先做个介绍&#xff0c;TileMap是基于 2D 图块的地图节点。Tilemap&#xff08;图块地图&#xff09;使用 TileSet&#xff0c;其中包含了图块的列表&#…

分布式id-Leaf算法

一、介绍 由美团开发&#xff0c;开源项目链接&#xff1a;https://github.com/Meituan-Dianping/Leaf Leaf同时支持号段模式和snowflake算法模式&#xff0c;可以切换使用。ID号码是趋势递增的8byte的64位数字&#xff0c;满足上述数据库存储的主键要求。 Leaf的snowflake模…