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

    文章

    6719

    浏览量

    107344
  • EDGE
    +关注

    关注

    0

    文章

    189

    浏览量

    43943
  • 浏览器
    +关注

    关注

    1

    文章

    1042

    浏览量

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

扫码添加小助手

加入工程师交流群

    评论

    相关推荐
    热点推荐

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

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

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

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

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

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

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

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

    老电视如何安装浏览器

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

    nginx中强缓存和协商缓存介绍

    强缓存直接告诉浏览器:在缓存过期前,无需与服务通信,直接使用本地缓存。
    的头像 发表于 04-01 16:01 726次阅读

    edge浏览器识别 latex语法插件

    默认的浏览器是没有latex识别功能的,容易显示为乱码或者源码,无法正常识别。本插件需要在浏览器的扩展程序菜单下安装,能在edge下完美运行。本插件是免费插件。
    发表于 03-17 18:03 1次下载

    腾讯AI To C业务大调整:QQ浏览器、搜狗等转入CSIG

    腾讯内部近期完成了一次重要的产品及团队调整,标志着其AI To C业务战略的新一轮变革。据悉,QQ浏览器、搜狗输入法以及ima等多款产品和应用,将正式并入CSIG(云与智慧产业事业群)。 此次调整
    的头像 发表于 02-20 09:22 1318次阅读

    E2000 Speedometer测试浏览器性能

    Edge最强 傲游不输Chrome 环球网财经) Chromium是由Google启动的一个开源网络浏览器项目,也是流行的Chrome浏览器的基础。虽然Chrome包含专有功能,但Chromium
    发表于 01-10 21:33

    华为云 Flexus 云服务 X 实例之 openEuler 系统下部署 SQLite 数据库浏览器 sqlite-web

    的资源调度能力和全面的安全保障体系,Flexus 云服务 X 实例已成为众多中小企业和开发者青睐的选择。本文将详细介绍如何在华为云 Flexus 云服务 X 实例上部署基于 openEuler 操作系统的 SQLite 数据
    的头像 发表于 01-08 11:42 975次阅读
    华为云 Flexus 云服务<b class='flag-5'>器</b> X 实例之 openEuler 系统下部署 SQLite 数据库<b class='flag-5'>浏览器</b> sqlite-web

    苹果Safari浏览器上的一个怪象:更白的白色

    、采用了 Intel i5 处理的 MacBook 上,使用 Safari 浏览器打开https://fff.kidi.ng,看到的效果如下(试着截一下图就知道这里为什么不得不贴照片了): 是文字更
    的头像 发表于 01-07 09:28 976次阅读
    苹果Safari<b class='flag-5'>浏览器</b>上的一个怪象:更白的白色

    2024年12月浏览器市场份额报告:谷歌Chrome稳居榜首

    %,彰显了其作为全球最受欢迎的浏览器之一的强大实力。 紧随其后的是苹果Safari浏览器,凭借17.09%的市场份额位列第二。Safari浏览器凭借其在苹果设备上的预装优势,以及流畅的用户体验,赢得了大量用户的青睐。 而
    的头像 发表于 01-02 14:58 3223次阅读

    SOLIDWORKS 2025基于浏览器角色的新功能:如何简化设计流程?

    文章来源:SOLIDWORKS代理商硕迪科技 SOLIDWORKS 2025 在2025版本中,SOLIDWORKS引入了一系列基于浏览器角色的新功能,本文将深入探讨SOLIDWORKS 2025
    的头像 发表于 12-30 10:26 1097次阅读
    SOLIDWORKS 2025基于<b class='flag-5'>浏览器</b>角色的新功能:如何简化设计流程?

    讯飞星火浏览器插件全新升级

    时刻陪伴,星火插件让你的浏览器变成真正的生产力工具。
    的头像 发表于 12-25 09:48 1746次阅读

    Chrome浏览器优化Android性能,骁龙8至尊版表现突出

    谷歌近日对Chrome浏览器的最新版本进行了重大更新,特别针对Android设备进行了性能优化,特别是对于搭载骁龙8至尊版处理的旗舰设备而言。 自Chrome M112版本以来,Android
    的头像 发表于 12-13 14:44 1715次阅读