写点什么

Howler.js:用于现代 Web 的音频库

  • 2018-11-26
  • 本文字数:974 字

    阅读完需:约 3 分钟

Howler.js:用于现代Web的音频库

Howler.js提供了一个现代音频库,支持Web Audio APIHTML5 Audio的回退机制。该项目致力于简化与使用 JavaScript 开发跨平台音频相关的开发工作。


Howler.js 为通过 JavaScript 使用音频提供了一致的 API,可以控制常见的音频模式,包括播放、暂停、搜索速率、淡入淡出和循环播放。在可能的情况下,音频文件会被自动缓存起来,用以提高播放性能。


<script src="/path/to/howler.js"></script><script>    var sound = new Howl({      src: ['sound.webm', 'sound.mp3']    });</script>
复制代码


或者可以利用 ES 模块将 Howler.js 作为依赖导入:


import {Howl, Howler} from 'howler';
const {Howl, Howler} = require('howler');
var sound = new Howl({ src: ['sound.mp3']});
sound.play();
复制代码


Howler.js 提供了两个用于处理音频的高级构造:


  • Audio Sprites——使用 Sprite 定义和控制音频文件的片段,以实现精确播放,并可以使用更小的资源;

  • Spatial Audio——提供立体声声像或 3D 游戏音频等音效。


处理音频的一个重大挑战是支持编码解码。Howler.js 支持目前浏览器提供的 14 种不同形式,包括 MP3、OPUS、OGG、WEBM 等。


Howler.js 支持所有现代 Web 浏览器,还支持 Internet Explorer 9,还被用在使用Cordova基于 HTML5 的Facebook Instant Games平台的的混合移动应用程序中。


众所周知,Web Audio API 的当前实现面临着若干挑战。规范五年多来一直在发生变化,对关键特性进行了几轮的修改。最近通过AudioWorklets将音频处理移到一个单独的线程中,类似于 Web Worker。Web Audio 的浏览器支持仍然不一致,Howler.js 可帮助开发人员避开这些问题。


最近的一个挑战是在播放音频剪辑之前引入用户交互。


SitePen 高级软件工程师 Paul Shannon 向 InfoQ 分享了他有关 Howler.js 以及 Web Audio 的现状和未来的想法:


Web Audio 就像音频方面的 Canvas,提供低级别的声音访问。遵循这个逻辑,Howler.js 之于 Web  Audio 就像 Threejs 之于 3D 图形。或许一旦 Web Audio 得到大规模采用,我们就会看到用于音频方面的 Instagram 风格的过滤器出现!


几家大型技术和媒体公司正在使用 Howler.js,包括谷歌、迪士尼、Mozilla 和乐高。


Howler.js 具有模块化架构,gzip 压缩后只有 7KB。Howler.js 基于 MIT 开源许可。欢迎通过Howler.js GitHub项目加入贡献行列。


查看英文原文Howler.js Audio Library for the Modern Web


2018-11-26 00:004603
用户头像

发布了 731 篇内容, 共 416.8 次阅读, 收获喜欢 1979 次。

关注

评论 1 条评论

发布
暂无评论
发现更多内容

Dubbo 3.0 前瞻系列:服务发现支持百万集群,带来可伸缩微服务架构

阿里巴巴云原生

开源 微服务 云原生 dubbo 中间件

你真的会学习吗?从结构化思维说起

阿里巴巴云原生

云原生 技术人 自我思考 职场成长 成长笔记

智慧平安小区整体解决方案,智慧社区管控系统开发

13530558032

如何通过一个SDK轻松搞定人脸识别,拯救初入职场的程序猿

华为云开发者联盟

人脸识别 智能 识别

PiNetwork 挖矿算力系统开发

Geek_a620db

道高一丈,且看CWE4.2的新特性

华为云开发者联盟

技术 安全 漏洞

LeetCode题解:剑指 Offer 40. 最小的k个数,sort,JavaScript,详细注释

Lee Chen

算法 大前端 LeetCode

3D 可视化突发公共卫生事件 ,防护效率高达90%

一只数据鲸鱼

疫情 物联网 数据可视化 数据监测 3D可视化

企业使用云计算低效益怎么办?区块链或成良药

CECBC

云计算

阿里云仓库使用小技巧

Java maven

漏洞扫描软件AWVS的介绍和使用

行者AI

安全 漏洞

软件测试所需要掌握的技能

测试人生路

软件测试

高速增长的跨境电商业务背后,区块链应用场景来了吗?

CECBC

跨境电商

阿里“云钉一体”加速整合 低代码开发平台“钉钉宜搭”发布

TE产服

浅谈如何做客户端性能测试

行者AI

性能测试

圣诞狂欢,保险师APP赋能精细、个性化的运营服务

DT极客

这份阿里P8级别内部疯传的“Linux私房菜”让你一次吃个饱

Java架构之路

Java 程序员 架构 面试 编程语言

批量作业调度工具Taskctl Web应用版/ETL免费调度工具/数据挖掘,抽取,转换工具

TASKCTL

数据挖掘 大数据 kettle 运维自动化 海豚调度

ARTS打卡 第28周

引花眠

微服务 ARTS 打卡计划 springboot

区块链食品溯源系统开发,农产品溯源小程序搭建

13530558032

CEG挖矿系统APP开发|CEG挖矿软件开发

系统开发

阿里云开源项目 OAM 负责人张磊入选「中国开源先锋 33 人」

阿里巴巴云原生

开源 开发者 云原生 k8s cncf

从根上理解高性能、高并发(二):深入操作系统,理解I/O与零拷贝技术

JackJiang

网络编程 高并发 高性能 即时通讯

利用文字技术帮助选购商品,慧眼“识”物的人都这样做……

华为云开发者联盟

文字识别 智能 识别

ModelArts黑科技揭秘|弹性训练,让训练资源张弛有度

华为云开发者联盟

学习 华为云

STARFIELD星域APP系统开发|STARFIELD星域软件开发

系统开发

7年Java开发经验,面试20多家公司,砍下16个Offer,总结干货面试题!

Java架构追梦

Java 架构 面试 大厂

SpringBoot系列(7)- 自动装配

引花眠

springboot

区块链电子合同铸就数字经济信任基石

CECBC

电子合同

Seata-AT 如何保证分布式事务一致性

阿里巴巴云原生

云计算 开源 分布式 微服务 云原生

大作业2

起风了

架构师一期

Howler.js:用于现代Web的音频库_前端_Dylan Schiemann_InfoQ精选文章