Loading [MathJax]/jax/output/CommonHTML/config.js
前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >页面的背景音乐加载很慢

页面的背景音乐加载很慢

作者头像
雨临Lewis
发布于 2022-01-11 06:12:24
发布于 2022-01-11 06:12:24
1.6K0
举报
文章被收录于专栏:雨临Lewis的博客雨临Lewis的博客

问题

由于我在页面中了<audio>标签来播放一首背景音乐,该音频是一首大小为2.7MB的MP3文件。在第一次加载该页面时,需要花费相当长的一段时间去加载音频。

解决方法

百度了下才知道,原来超过2MB的背景音乐其实是一个很巨大的文件了,如果网速稍微慢一些用户体验就会很差了。大概有几种解决的办法:

  1. 把音乐加到FLASH里
  2. 使用rm或wma格式的背景音乐
  3. 降低MP3文件的音质
  • 第一个就不说了,FLASH已经声名狼藉,注定凉凉了。
  • 第二个出于不同浏览器的兼容性以及<audio>标签的兼容性,还是决定使用MP3文件。
  • 最后就只能使用第三种方法了,通过MP3压缩软件,最后将该MP3音频压缩到了400KB左右,总算是马马虎虎实现了想要的效果。

这里说一下,我用的mp3压缩软件是RazorLame

参考链接

警告

本文最后更新于 January 12, 2021,文中内容可能已过时,请谨慎使用。

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2018-12-192,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
MP3的频率、比特率、码率与音质的关系
想知道MP3的频率、比特率、码率与音质的关系,是不是频率越高,码率越高,音质就越好。好像MP3大多数的频率都是44100HZ的。码率有128,192等等。
全栈程序员站长
2022/07/12
3.3K1
理解 iOS Core Audio 音频概念
在了解 iOS Core Audio 相关技术的时候,会遇到 bitrate、sample、frame 和 packet 等概念。由于业界在不同场合下使用 packet 和 frame 等词语会代表不同的含义,一不小心,很容易被绕进去。 本文讲述了 iOS Core Audio 中常用的音频概念定义,然后介绍一些容易造成概念混淆的场景以及一个实践 demo 案例,最后解答一些常见的问题。 (一) iOS Core Audio 音频概念定义 讨论 iOS Core Audio,就要按照苹果的定义对音频相关概
QQ音乐技术团队
2018/02/01
2.6K0
理解 iOS Core Audio 音频概念
一文读懂 TsFile
回想起来,第一次对文件格式有直接的认识,还是在很久很久以前那个MP3随身听流行的年代。那时候,一个MP3随身听的容量通常是128MB;一首.mp3格式的音乐大约为4MB。我是个杰伦粉,当时杰伦发行了大约60首歌曲,而我最大的愿望是在MP3随身听里存下所有杰伦的歌曲。很明显,128MB的随时听最多也只能存30首歌曲,苦恼的博主在一番探索之后,发现手里的MP3播放器不仅能播放.mp3的音乐,还能播放.wma格式的歌曲;而且,一首wma格式的音乐大小只有2MB!有了这个办法,我终于不用每周更换一次MP3里的歌曲了...
Apache IoTDB
2022/05/16
1.3K0
一文读懂 TsFile
MoneyPrinter一键生成短视频的优化版开源项目来了,实测效果不错!支持中英文,画面、解说、背景音乐、字幕等要素一键生成!
在如今这个短视频盛行的时代,不管你是自媒体人还是普通人,是否也想过拥有一款能一键生成短视频的工具?
Python兴趣圈
2024/03/27
7.4K1
MoneyPrinter一键生成短视频的优化版开源项目来了,实测效果不错!支持中英文,画面、解说、背景音乐、字幕等要素一键生成!
神器!人工智能分离歌曲中的人声和背景音乐
之前分享过将视频转GIF如何将视频轻松转换为 GIF 和文字转语音 如何轻松的将文字转语音 ,今天分享几个神器,可以分离音频中的人声和背景音乐。
苏生不惑
2020/09/10
6.7K0
跟我学Rx编程——调皮的背景音乐按钮
有些H5的页面会有一个按钮控制背景音乐播放,如果只是单一页面的话,没有什么逻辑可言。但如果涉及到转场,那么逻辑就复杂起来。
我不是码神
2022/07/28
5420
10分钟:教你学会做出能击败80%人的公众号语音
微信前些日子开放了语音功能,想必很多人都在尝试这个功能。录音是件费时费力的事情,咱都不是专业主播,没法子一气呵成。一大段内容,想到哪说到哪,录遭了怎么办?如何编辑?如何润色?如何像专业podcast那样添加片头片尾?如何添加背景音乐? 程序君在做自己第一期的时候就遭遇这些子问题。本着外事不明问google的态度,程序君发现不少业余podcast大拿,用的是免费的GarageBand。这是Mac下的一款DJ软件,Garage Band,名字相当形象,用它来做podcast,有点大材小用,不过还是相当合适的。依
tyrchen
2018/03/28
1.3K0
10分钟:教你学会做出能击败80%人的公众号语音
HTML5 标签audio添加网页背景音乐代码[通俗易懂]
分享一下我老师大神的人工智能教程!零基础,通俗易懂!http://blog.csdn.net/jiangjunshow
全栈程序员站长
2022/09/29
2.6K0
HTML5 标签audio添加网页背景音乐代码[通俗易懂]
零基础入门:实时音视频技术基础知识全面盘点
随着移动网络速度越来越快、质量越来越来,实时音视频技术已经在各种应用场景下全面开花,语音通话、视频通话、视频会议、远程白板、远程监控等等。
JackJiang
2020/07/24
1.5K0
音频格式的汇总及压缩比较
数字音源,也就是数字音频格式,最早指的是CD,CD经过压缩之后,又衍生出多种适于在随身听上播放的格式,这些压缩过的格式,我们可以分为两大类:有损压缩的和无损压缩的。这里所说的压缩,是指把PCM编码的或者是WAV格式的音频流经过特殊的压缩处理,转换成其他格式,从而达到减小文件体积的效果。有损/无损,是指经过压缩过后,新文件所保留的声音信号相对于原来的PCM/WAV格式的信号是否有所削减。
ZONGLYN
2019/08/08
10.8K0
分享一款刚开源上线3天的音乐人声分离工具!无需联网!页面化操作!
人声分离 是一项重要的音频处理技术,它可以将混合音频中的 人声和背景音乐 分离出来,为音频处理和后期制作提供了便利。
Python兴趣圈
2023/12/30
8400
分享一款刚开源上线3天的音乐人声分离工具!无需联网!页面化操作!
HTML5 标签audio添加网页背景音乐代码
html5 <audio> 是 HTML 5 的新标签,定义声音,比如音乐或其他音频流。
阳光岛主
2019/02/18
11.5K0
python带你剪辑视频
嗯,好久没写文章了。因为最近没有熬夜了,天天背电脑也很辛苦。 工作嘛,手工为主,没有啥技术成长,也没啥好写的。 疫情期间,总听到有人叹气,总听到抖音里面“我太难了”。
赵云龙龙
2020/08/13
2.9K0
AI会是音乐行业的《命运交响曲》吗?|AI&Society创造营2万字实录
5月7日,腾讯研究院举办了主题为“AI 是音乐行业的《命运交响曲》吗? ——人工智能如何重塑音乐创作、服务与产业”的线上沙龙,探讨人工智能技术如何在音乐领域带来创新和变革。
小腾资讯君
2024/07/11
2100
Unity3D游戏开发初探—4.开发一个“疯狂击箱子”游戏
  (1)如何在游戏脚本程序中创建对象而不是一开始就创建好对象?->使用GameObject的静态方法:CreatePrimitive()
Edison Zhou
2018/08/20
1.6K0
Unity3D游戏开发初探—4.开发一个“疯狂击箱子”游戏
用ffmpeg 提取MP3
:现在有个视频video.avi,有个音频 audio.mp3,将其合并成output.avi
py3study
2020/01/07
4.9K0
菜鸟也能懂的 - 音视频基础知识
1,光和颜色光是一种肉眼可以看见(接受)的电磁波(可见光谱)。在科学上的定义,光有时候是指所有的电磁波。光是由一种称为光子的基本粒子组成。具有粒子性与波动性,或称为波粒二象性。人类肉眼所能看到的可见光只是整个电磁波谱的一部分。电磁波之可见光谱范围大约为 390~760nm(1nm=10-9m=0.000000001m)。
入门笔记
2023/03/08
9150
菜鸟也能懂的 - 音视频基础知识
中国芯片中的“一代拳王”!
芯片“一代拳王”说法是由中国台湾联发科董事长蔡明介提出的。对芯片设计行业往往长江后浪推前浪,借助新的消费电子产品形态/功能,或者新的晶圆制造制程技术,确实存在着新出生的芯片“后发先至”的机会,并“一炮而红”,但能不能持续则又是一回事。联发科在山寨GSM手机芯片一举爆红之后,进入3G和4G时代时两次遭遇巨大危机,幸而走出来。
芯智讯
2023/02/09
1.3K0
实时音视频开发学习2 - TRTC底层实现机制
以上是对腾讯云TRTC产品的一个基本概述,既然知道了这个东西功能这么丰富,拿它涉及了一些什么基础技术,又是怎么实现这个音视频的原理呢?以下便是对其的一个详解。
金林学音视频
2020/08/20
3.1K1
实时音视频开发学习2 - TRTC底层实现机制
常见的音乐格式
WAVE文件作为最经典的Windows多媒体音频格式,应用非常广泛,它使用三个参数来表示声音:采样位数、采样频率和声道数。声道有单声道和立体声之分,采样频率一般有11025Hz(11kHz)、22050Hz(22kHz)和44100Hz(44kHz)三种。WAVE文件所占容量=(采样频率×采样位数×声道)×时间/8(1字节=8bit)。
赵彤刚
2022/12/12
1.3K0
推荐阅读
相关推荐
MP3的频率、比特率、码率与音质的关系
更多 >
领券
💥开发者 MCP广场重磅上线!
精选全网热门MCP server,让你的AI更好用 🚀
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档