Logo
☆☆☆☆☆
0.0
Intermediate
11h

构建渐进式Web应用

Web开发充满挑战,但渐进式Web应用(PWA)相较于传统Web应用具有显著优势,能够实现安装到设备、离线访问以及推送通知等功能。 你将从了解PWA开始,掌握PWA的核心原则。接着学习如何使用服务工作线程API实现离线支持、拦截网络请求以及应用安装提示栏等功能。随后深入学习提升性能的缓存策略,利用IndexedDB在本地存储数据,并通过后台同步功能应对网络不稳定的情况。最后,你将学习响应式网页设计和原生设备API,让PWA在外观和体验上更接近原生应用。 完成本课程后,你将能够构建具备吸引力且响应迅速的渐进式应用。同时,你也具备将现有Web应用优化为PWA的能力,从而扩大应用的覆盖范围并提升性能。

11 Lessons
Included in Subscription Plan
Personalized Learning
Powered by AI
构建渐进式Web应用
Web开发充满挑战,但渐进式Web应用(PWA)相较于传统Web应用具有显著优势,能够实现安装到设备、离线访问以及推送通知等功能。 你将从了解PWA开始,掌握PWA的核心原则。接着学习如何使用服务工作线程API实现离线支持、拦截网络请求以及应用安装提示栏等功能。随后深入学习提升性能的缓存策略,利用...

WHAT YOU'LL LEARN

对渐进式Web应用架构以及服务工作者生命周期的理解

Content

11 Lessons • 0 Quizzes • 0 Challenges

简介
  1. 1

    渐进式网页应用简介

  2. 2

    渐进式网页应用(PWAs)与原生应用

  3. 3

    渐进式网页应用推动业务成功

  4. 4

    PWA 核心构建模块

  5. 5

    测验:PWA入门

理解应用清单
  1. 1

    开始使用 Web 应用清单

  2. 2

    了解应用清单属性

  3. 3

    添加到主屏幕的体验

  4. 4

    测验:理解应用清单

IndexedDB
  1. 1

    介绍 IndexedDB API

  2. 2

    IndexedDB 接口

  3. 3

    创建数据库和对象存储

  4. 4

    使用 IndexedDB 的 CRUD 操作

  5. 5

    IndexedDB 测验

服务工作者
  1. 1

    什么是服务工作者?

  2. 2

    服务工作者的功能事件

  3. 3

    服务工作者生命周期

  4. 4

    注册服务工作者

  5. 5

    在服务工作线程中响应传入的事件

  6. 6

    更新和激活服务工作者

  7. 7

    监听 fetch 事件

  8. 8

    测验:你了解服务工作者吗?

创建应用风格的用户界面和用户体验
  1. 1

    响应式设计

  2. 2

    CSS 媒体查询

  3. 3

    响应式图片

  4. 4

    可访问性

  5. 5

    响应式设计测验

使用服务工作者进行缓存
  1. 1

    缓存的必要性

  2. 2

    缓存 API 简介

  3. 3

    使用 Cache API

  4. 4

    缓存的类型

  5. 5

    静态缓存或预缓存

  6. 6

    从缓存中获取项目

  7. 7

    在离线模式下提供网页应用

  8. 8

    动态缓存静态内容

  9. 9

    更新缓存文件

  10. 10

    缓存注意事项与最佳实践

  11. 11

    缓存测验

离线体验与背景同步 API
  1. 1

    介绍背景同步 API

  2. 2

    背景同步 API 的工作原理

  3. 3

    周期性后台同步 API

  4. 4

    背景同步 API 测验

缓存策略
  1. 1

    按需缓存策略

  2. 2

    离线备用页面

  3. 3

    缓存优先,网络回退策略

  4. 4

    仅缓存策略

  5. 5

    仅网络策略

  6. 6

    带缓存回退的网络策略

  7. 7

    缓存优先策略

  8. 8

    缓存策略测验

Web推送通知(通知API,推送API)
  1. 1

    Web推送通知简介

  2. 2

    推送通知的工作原理

  3. 3

    实现通知

  4. 4

    实现推送消息

  5. 5

    Web推送通知测验

原生设备功能
  1. 1

    原生设备功能简介

  2. 2

    Web 分享 API

  3. 3

    地理位置 API

  4. 4

    MediaStream API

  5. 5

    Web APIs 测验

总结
  1. 1

    结论

Certificate of Completion

Showcase your accomplishment by sharing your certificate of completion.

Course Author:Anonymous User

Reviews

Read reviews from students who have taken this course and share your own experience.

Reviews & Comments (0)