search
HomeWeb Front-endH5 TutorialH5 application cache-Manifest specific introduction

Introduction

Manifest is an application provided by H5Cache Mechanism, based on which web applications can achieve offline access (offline cache). To this end, the browser also provides an application cache API--applicationCache. Although the manifest technology has been abandoned by web standards, this does not affect our attempt to understand it. . It is precisely because the application caching mechanism of manifest is so attractive that Ele.me and office 365 mailboxes are still using it!

Description

Students who are familiar with manifest can skip it This section.

In view of the manifest application caching technology, we can achieve:

Offline access: Even if the server is down or there is no network, users can still browse web content normally.

Faster access: The data exists locally, saving the time for the browser to initiate an http request, so the access is faster, and the effect on the mobile terminal is more obvious.

Reduce load: The browser only displays in the manifest file Only when changes are made will the server download the resources that need to be cached, which greatly reduces the server load.

The process of manifest caching is as follows (from the Internet):

Supportability

Mainstream browsers All support manifest application caching technology. The following table:

H5 application cache-Manifest specific introduction

In the H5 standard, the Offline Web applications part has the following description:

This feature is in the process of being removed from the Web platform. 
(This is a long process that takes many years.) 
Using any of the offline Web application features at this time is highly discouraged. Use service workers instead. [SW]

So I will follow up on other The article continues to introduce service workers. This article continues to focus on the manifest.

How to enable application caching

The manifest is managed using the cache manifest. The cache manifest needs to be associated with the html tag . As follows:

<html manifest="test.appcache">
  ...
</html>

Specifying the manifest file in the html tag means that the webpage uses the manifest for offline caching. The list of files that need to be cached in the webpage needs to be specified in the test.appcache text file.

manifest cache list

Just like writing an article, the manifest adopts the classic three-stage structure. They are: CACHE, NETWORK and FALLBACK. As follows, let’s take a look at a chestnut first.

The above is the detailed content of H5 application cache-Manifest specific introduction. For more information, please follow other related articles on the PHP Chinese website!

Statement
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
h5是指什么h5是指什么Aug 02, 2023 pm 01:52 PM

H5是指HTML5,是HTML的最新版本,H5是一个功能强大的标记语言,为开发者提供了更多的选择和创造空间,它的出现推动了Web技术的发展,使得网页的交互和效果更加出色,随着H5技术的逐渐成熟和普及,相信它将会在互联网的世界中发挥越来越重要的作用。

manifest文件有什么用manifest文件有什么用Mar 13, 2023 pm 02:02 PM

manifest文件的作用是声明组件,并指定app的一些权限(permission)和instrumentation(安全控制和测试);manifest作为整个Android应用的入口,其Manifest.xml描述了package中暴露的组件,他们各自的实现类,各种能被处理的数据和启动位置。

如何区分H5,WEB前端,大前端,WEB全栈?如何区分H5,WEB前端,大前端,WEB全栈?Aug 03, 2022 pm 04:00 PM

本文带你快速区分H5、WEB前端、大前端、WEB全栈,希望对需要的朋友有所帮助!

h5如何使用positionh5如何使用positionDec 26, 2023 pm 01:39 PM

在H5中使用position属性可以通过CSS来控制元素的定位方式:1、相对定位relative,语法为“style="position: relative;”;2、绝对定位absolute,语法为“style="position: absolute;”;3、固定定位fixed,语法为“style="position: fixed;”等等。

h5怎么实现web端向上滑动加载下一页h5怎么实现web端向上滑动加载下一页Mar 11, 2024 am 10:26 AM

实现步骤:1、监听页面的滚动事件;2、判断滚动到页面底部;3、加载下一页数据;4、更新页面滚动位置即可。

vue3怎么实现H5表单验证组件vue3怎么实现H5表单验证组件Jun 03, 2023 pm 02:09 PM

效果图描述基于vue.js,不依赖其他插件或库实现;基础功能使用保持和element-ui一致,内部实现做了一些移动端差异的调整。当前构建平台使用uni-app官方脚手架构建,因为当下移动端大多情况就h6和微信小程序两种,所以一套代码跑多端十分适合技术选型。实现思路核心api:使用provide和inject,对应和。在组件中,内部用一个变量(数组)去将所有实例储存起来,同时把要传递的数据通过provide暴露出去;组件则在内部用inject去接收父组件提供过来的数据,最后把自身的属性和方法提交

总结介绍H5新晋级标签(附示例)总结介绍H5新晋级标签(附示例)Aug 03, 2022 pm 05:10 PM

​本文给大家整理介绍H5新晋级标签有哪些,希望对需要的朋友有所帮助!

页面h5和php是什么意思?(相关知识探讨)页面h5和php是什么意思?(相关知识探讨)Mar 20, 2023 pm 02:23 PM

HTML5和PHP是Web开发中常用的两种技术,前者用于构建页面布局、样式和交互,后者用于处理服务器端的业务逻辑和数据存储。下面我们来深入探讨HTML5和PHP的相关知识。

See all articles

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

AI Hentai Generator

AI Hentai Generator

Generate AI Hentai for free.

Hot Article

Repo: How To Revive Teammates
1 months agoBy尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Energy Crystals Explained and What They Do (Yellow Crystal)
2 weeks agoBy尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: How To Get Giant Seeds
1 months agoBy尊渡假赌尊渡假赌尊渡假赌

Hot Tools

Dreamweaver Mac version

Dreamweaver Mac version

Visual web development tools

MantisBT

MantisBT

Mantis is an easy-to-deploy web-based defect tracking tool designed to aid in product defect tracking. It requires PHP, MySQL and a web server. Check out our demo and hosting services.

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SAP NetWeaver Server Adapter for Eclipse

SAP NetWeaver Server Adapter for Eclipse

Integrate Eclipse with SAP NetWeaver application server.

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)