0
  • 聊天消息
  • 系统消息
  • 评论与回复
登录后你可以
  • 下载海量资料
  • 学习在线课程
  • 观看技术视频
  • 写文章/发帖/加入社区
会员中心
创作中心

完善资料让更多小伙伴认识你,还能领取20积分哦,立即完善>

3天内不再提示

微软的 Edge 如何成为优秀的 PWA 浏览器?

如意 来源:前端全栈开发者 作者:张张 2020-10-22 15:55 次阅读
加入交流群
微信小助手二维码

扫码添加小助手

加入工程师交流群

近年来,由于网络巨头和移动开发人员的推动,渐进式Web应用已成为一种增长趋势,因为它们允许将类似原生的体验带入任何平台。

在最致力于这项新技术的公司中,有Microsoft,它通过PWABuilder[1]等项目帮助Web开发人员拥抱了这一新技术。随着第一个基于Chromium的微软Edge版本的推出,以及最近在Build 2020上的宣布,该公司通过引入令人兴奋的新功能和API,旨在弥合原生应用程序和Web应用程序之间的差距。

那么,这些变化是什么,对你意味着什么?

PWA是Windows上的一等公民

第一组更改涉及从Microsoft Edge安装的PWA与Windows交互的方式。

直到现在,从Edge安装一个Web应用意味着拥有一个令人难以置信的原生感觉的应用程序,然而在某些情况下表现得很奇怪。

例如,它们在“设置”应用程序或任务管理器中没有显示为单独的应用程序,从而使它们更难管理,特别是对于不太精通技术的用户。Edge团队在Build 2020上进行了虚拟演示,宣布在即将发布的浏览器版本中,PWA将被Windows视为其他任何应用程序,所有这些将很快得到修复。

除此以外,安装网络应用还能够被设置为共享目标(即它们将出现在Windows共享对话框的应用列表中),在操作系统启动时请求启动权限,并将某些文件类型、URL和协议设置为默认。

新的API

除了旨在让 PWA 感觉更原生的变化之外,Edge 团队还发布了一套新的 API,让 Web 应用的行为更像他们的原生应用。

可自定义的标题栏

从UI角度来看,PWA的最明显的缺点之一是当它们在桌面设备上运行时无法自定义其标题栏。

在即将推出的Edge版本中,新的API应该可以解决这个问题,允许开发人员在标题栏下扩展HTML元素。

直到现在,PWA都不能像其原生版本一样自由地自定义其标题栏

这对于复杂的PWA特别有用,因为他们可以在用户界面中放置标签和搜索栏,而不会浪费宝贵的空间。

原生文件系统访问

到目前为止,不允许网站将文件保存在用户设备上的特定位置。这意味着在线照片编辑器需要用户上传他们想要编辑的照片,然后下载到他们的设备上,而原生的照片编辑器只会给出替换现有照片的选项。

从Edge 86开始(83版本是写稿时最新的版本),开发者将能够替换用户在会话中选择的所有文件,从而使Web上的生产力应用更加有用。

徽章

我们已经知道一个将徽章添加到应用程序图标的API将出现在基于Chromium的浏览器中,但现在我们第一次看到了全貌:我们不仅能够将带有数字和图标的徽章添加到PWA中,我们还将获得一个新的事件,用于在服务线程中更新徽章的内容。我觉得这种事件的概念非常有趣,因为它引入了一种轻量级的替代品,用于推送通知的事件。

虽然看起来只是一个小小的UI调整,但我不会因为这只是一个小小的改变就不屑一顾,因为用户研究已经多次证明,在应用图标上添加徽章可以大幅提高用户参与度。

通往Microsoft Store的简便途径

多亏了PWABuilder,它已经可以以最小的努力将PWA发布到Microsoft Store。这种方法最相关的缺点是,打包后的Web应用运行在传统的Edge引擎上,而不是Chromium上,因此无法利用一些新发布的API。

在Build 2020中,我们发现这一切都将在几个月后发生变化,届时PWABuilder将允许打包的Web应用程序在Chromium上运行。

结束

作为一名网络开发者,我很高兴看到微软在渐进式Web应用上投入如此之大,因为我认为它们不仅是网络体验的未来,也是移动应用的未来,这样的功能使它们成为原生语言和框架的更可行的替代品。

如果你和我一样对这些改进感到兴奋,我建议你去看看作为Project Fugu的一部分正在开发的PWA的建议功能列表[2],Project Fugu是谷歌、微软和英特尔的跨公司努力,为我们带来了许多前面提到的变化。
责编AJX

声明:本文内容及配图由入驻作者撰写或者入驻合作网站授权转载。文章观点仅代表作者本人,不代表电子发烧友网立场。文章及其配图仅供工程师学习之用,如有内容侵权或者其他违规问题,请联系本站处理。 举报投诉
  • 微软
    +关注

    关注

    4

    文章

    6750

    浏览量

    108076
  • EDGE
    +关注

    关注

    0

    文章

    193

    浏览量

    44226
  • 浏览器
    +关注

    关注

    1

    文章

    1043

    浏览量

    37165
收藏 人收藏
加入交流群
微信小助手二维码

扫码添加小助手

加入工程师交流群

    评论

    相关推荐
    热点推荐

    深入剖析AD6650:打造高性能GSM/EDGE接收系统的核心利器

    中频到基带接收,凭借其卓越的性能和丰富的功能,成为了众多工程师的首选。今天,我们就来深入剖析这款芯片,看看它究竟有哪些独特之处。 文件下载: AD6650.pdf 1. 产品概述 AD6650是一款面向GSM/EDGE应用的窄
    的头像 发表于 04-01 17:20 569次阅读

    VF2 Debian image 69 Web 浏览器失败,怎么修复?

    只需启动并运行图像 69。 $ ip 一个 显示互联网连接已建立良好。 单击以运行默认的Web浏览器时,会弹出一条错误消息。 “无法执行默认 Web 浏览器。” 输入/输出错误。 有什么提示需要修复吗?
    发表于 03-24 06:54

    无需安装!在浏览器里就能玩转ESP32/ESP8266,这个神器绝了!

    无需安装!在浏览器里就能玩转ESP32/ESP8266,这个神器绝了!【往期精选】十年嵌入式最深的痛,不是Bug,而是抓不到日志!vivo宣布原生支持HomeAssistant生态设备接入(含
    的头像 发表于 01-10 10:01 1354次阅读
    无需安装!在<b class='flag-5'>浏览器</b>里就能玩转ESP32/ESP8266,这个神器绝了!

    鸿蒙手机系统6.0用浏览器看视频,视频显示不能横屏。怎么设置?

    鸿蒙手机系统6.0用浏览器看视频,视频显示不能横屏。怎么设置? 如何掂让这个竖屏切换为横屏?
    发表于 12-20 20:10

    PSoC™ Edge E84 评估套件:开启下一代机器学习边缘设备设计之旅

    PSoC™ Edge E84 评估套件:开启下一代机器学习边缘设备设计之旅 在电子工程师不断追求创新与高效的今天,一款优秀的评估套件能够极大地加速产品的设计与开发进程。英飞凌的 PSoC™ Edge
    的头像 发表于 12-18 14:40 740次阅读

    电能质量在线监测装置的多维度统计报表支持远程访问导出吗?

    是的,现代电能质量在线监测装置的多维度统计报表全面支持远程访问导出功能 ,已成为主流产品标配,可通过多种方式随时随地获取分析数据。 一、远程访问导出方式全景 1. Web 浏览器直连(最通用) 输入
    的头像 发表于 12-17 15:39 499次阅读
    电能质量在线监测装置的多维度统计报表支持远程访问导出吗?

    Amphenol Hyper Cool Edge Connectors:高性能连接解决方案

    Amphenol Hyper Cool Edge Connectors:高性能连接解决方案 在电子设备不断追求高速、高效传输的今天,连接的性能对设备整体表现起着至关重要的作用。Amphenol
    的头像 发表于 12-10 14:15 553次阅读

    CATV 基础设施放大器 1.2 GHz CCAP/Edge QAM/CMTS 驱动 skyworksinc

    电子发烧友网为你提供()CATV 基础设施放大器 1.2 GHz CCAP/Edge QAM/CMTS 驱动相关产品参数、数据手册,更有CATV 基础设施放大器 1.2 GHz CCAP/Edge
    发表于 09-11 18:33
    CATV 基础设施放大器 1.2 GHz CCAP/<b class='flag-5'>Edge</b> QAM/CMTS 驱动<b class='flag-5'>器</b> skyworksinc

    Microsoft Edge浏览器iOS端插件功能上线

    在最新发布的 139 版本中,Microsoft Edge 浏览器 iOS 端正式支持插件功能!与此同时,Microsoft Edge 安卓端的插件数量已跃升至近 30 款。广告拦截、双语翻译、资源下载……你的手机
    的头像 发表于 08-19 14:29 1991次阅读

    亚马逊云科技推出Amazon Nova Act SDK预览版,加速浏览器自动化Agent落地

    北京2025年8月5日 /美通社/ -- 亚马逊云科技日前宣布,推出Amazon Nova Act SDK有限预览版,可快速帮助客户将基于浏览器的Agent从原型部署至生产环境。该SDK可与亚马逊云
    的头像 发表于 08-06 08:42 955次阅读

    微软Microsoft Edge浏览器构筑立体式安全防线

    在信息爆炸的今天,钓鱼网站、诈骗广告、隐私追踪层出不穷。Microsoft Edge 浏览器为桌面与移动端用户构筑了立体式安全防线。用七大安全护盾,保护你的上网安全。
    的头像 发表于 08-04 15:39 1512次阅读

    性能再升级!开鸿Bot系列V4.1.2.78.002版本发布

    开鸿BotBook和开鸿BotMini迎来V4.1.2.78.002版本升级本次升级聚焦用户体验优化重点优化了系统功能、浏览器功能开发者体验功能等带来更流畅、更高效的操作体验01系统功能优化蓝牙耳机
    的头像 发表于 07-11 19:53 763次阅读
    性能再升级!开鸿Bot系列V4.1.2.78.002版本发布

    用于四频 GSM / EDGE 的 Tx 前端模块 skyworksinc

    电子发烧友网为你提供()用于四频 GSM / EDGE 的 Tx 前端模块相关产品参数、数据手册,更有用于四频 GSM / EDGE 的 Tx 前端模块的引脚图、接线图、封装手册、中文资料、英文资料
    发表于 06-20 18:36
    用于四频 GSM / <b class='flag-5'>EDGE</b> 的 Tx 前端模块 skyworksinc

    老电视如何安装浏览器

    2017年购买的夏普老电视,1.5G+8G存储,网上下的浏览器APK文件在电视内打开就弹出“解析程序包出现问题”。 未知来源选项已打开,存储空间清空到只剩下三个应用(只占用300M左右),基本可
    发表于 06-01 18:57

    带有集成耦合的 Tx/Rx 前端模块,适用于四频 GSM 和 EDGE 应用 skyworksinc

    电子发烧友网为你提供()带有集成耦合的 Tx/Rx 前端模块,适用于四频 GSM 和 EDGE 应用相关产品参数、数据手册,更有带有集成耦合的 Tx/Rx 前端模块,适用于四频 GSM
    发表于 05-27 18:32
    带有集成耦合<b class='flag-5'>器</b>的 Tx/Rx 前端模块,适用于四频 GSM 和 <b class='flag-5'>EDGE</b> 应用 skyworksinc