Progressive Web Apps | Mendix Evaluation Guide

Skip navigation

Progressive Web Apps

Mendix 渐进式 Web 应用程序 (PWA) 是如何工作的?

渐进式 Web 应用程序 (PWA) 是一种特殊类型的 Web 应用程序,它通过渐进方式使用浏览器中的更多功能来改善用户体验。Mendix 渐进式 Web 应用程序类似于 Web 应用程序,但是 PWA 提供了更多功能 – 如您可以选择部分或完全脱机工作、添加到设备主屏幕以及对设备功能和网络推送通知进行支持。PWA 通常用于移动应用程序,但也可以用于桌面应用程序。

开发人员可以类似于用创建 Web 应用程序的方式创建 PWA。这种对称性为开发人员提供了他们习惯使用的所有选项,并使他们能够重用现有的组件和知识。此外,开发人员还可以申请使用 offline-first 方式改善应用程序性能和可用性。

开发人员可以只启用其用例所需的 PWA 功能,例如**Add to Home Screen** 支持、资源缓存(用于页面、样式和逻辑等)或完整脱机支持。开发人员还可以添加功能以利用设备功能,例如摄像头、定位服务、或添加对 Web 推送通知的支持。需要注意的是,可用功能取决于浏览器功能。

正如在 *Front-End* 中的 Mendix 如何支持多渠道应用程序?中讨论的,PWA 是 Mendix 应用程序的一种可选渠道。Mendix 客户端负责呈现 Web 应用程序,这些 Web 应用程序基于 JavaScript、HTML5 和 CSS3 的丰富的单页应用程序 (SPA)。PWA 还使用服务工作者来缓存数据并提高性能。

通过使用 Mendix Studio 和 Mendix Studio Pro 中的 WYSIWYG 页面编辑器,用户能够对可在本地运行或直接从 Mendix Studio 和 Mendix Studio Pro 部署的页面和交互进行建模。在本地运行时,更改将直接可见。这是通过我们的 **即时更新** 功能实现的。这一功能可在保持当前状态的同时立即重新加载 UI,从而使测试和预览应用程序变得简单。

将应用程序部署到云上时,静态资源(HTML、CSS、JavaScript)将部署在前端服务器上,该前端服务器可缓存并有效地提供资源。PWA 还可以将资源缓存在用户的浏览器中,以提高性能。* index.html * 页面作为主要的入口可以加载 Mendix 客户端、呈现页面并开始处理事件。如果需要身份验证,那么最终用户将被重新定向到登录页面或身份提供商。Mendix 通过应用缓存清除机制来确保在部署新版本时不会出现缓存问题。

Mendix JavaScript 客户端呈现 UI、在浏览器中处理操作并藉由 HTTPS 通过 API 与 Mendix Runtime 进行通信。这一丰富的客户端无需调用服务器即可执行许多操作,从而最大程度地减少了成本昂贵的服务器往返次数。结合我们的客户端功能以及 Mendix 应用程序在遵循访问功能准则的同时可以支持浏览器的后退/前进功能这一事实,您可以高效地为 Web 应用程序建模,并实现出色的性能。

Mendix 如何支持不同的屏幕尺寸和设备?

Mendix 页面默认情况下是响应式的,会自动调整屏幕大小。这样,最终的即时可用的 Web 应用程序无论在台式机还是手机的各种尺寸的屏幕上都能完美适用。为了获得最佳的用户体验,您可以为手机和平板电脑定义单独的移动网络渠道。也可以在其他场景的逻辑中使用设备类型(例如电话、平板电脑或台式机)。

Mendix 为每台设备提供了几种常见的模式和最佳实践,来帮助您构建良好的用户体验。您还可以使用自定义变体扩展这些模式,如用户界面设计中所述。

Mendix 为每台设备提供了几种常见的模式和最佳实践,来帮助您构建良好的用户体验。您还可以使用自定义变体扩展这些模式,如用户界面设计中所述

如何扩展我的渐进式 Web 应用程序?

Mendix 页面默认情况下是响应式的,会自动调整屏幕大小。这样,最终的即时可用的 Web 应用程序无论在台式机还是手机的各种尺寸的屏幕上都能完美适用。为了获得最佳的用户体验,您可以为手机和平板电脑定义单独的移动网络渠道。也可以在其他场景的逻辑中使用设备类型(例如电话、平板电脑或台式机)。

Mendix 为每台设备提供了几种常见的模式和最佳实践,来帮助您构建良好的用户体验。您还可以使用自定义变体扩展这些模式,如用户界面设计中所述。

如何分配我的渐进式 Web 应用程序?

由于 PWA 是 Web 应用程序,因此可以通过浏览器适用 URL 轻松打开程序并对其进行测试和分配。对于本地开发,Mendix 会生成二维码以便您可以在移动设备上快速测试 PWA。

如何测试我的渐进式 Web 应用程序?

Mendix 提供了一个集成的应用程序测试套件 (ATS),以便(非技术性)用户可以使用已记录的测试脚本在多个浏览器和多个设备上测试 Web 应用程序。

也可以使用标准的测试工具,例如 Selenium。由于 Mendix 小组件在文档对象模型 (DOM) 中具有唯一的标识符,因此测试工具可以轻松利用这些 ID 来创建可读且稳定的测试脚本。

也可以使用标准的测试工具,例如 Selenium。由于 Mendix 小组件在文档对象模型 (DOM) 中具有唯一的标识符,因此测试工具可以轻松利用这些 ID 来创建可读且稳定的测试脚本。