- Updated descriptions and terminology across various component documentation files for improved clarity. - Changed headings and section titles for better readability and consistency. - Enhanced the language and structure of the documentation to provide clearer guidance on usage and configuration. - Removed the `fix-docs.js` script as its functionality has been integrated into the translation process. - Improved the translation script to handle Markdown code block issues and added retry logic for API calls.
ArtPlayer.js
🎨 ArtPlayer.js is a modern and full featured HTML5 video player
・ Online Editor ・ API Document ・ Danmuku ・ Changelog ・ 🤖LLMs ・
Home Page
Mobile Demo
Features
ArtPlayer.js is an easy-to-use and feature-rich HTML5 video player, and most of the player's functional controls support customization, which makes it easy to connect with your business logic. In addition, it directly supports .vtt, .ass and .srt subtitle formats. Integration with other dependencies such as flv.js, hls.js, dash.js, etc. is also very simple. The code is highly decoupled, the structure and logic are clear, and it is easy to track errors and add new features.
Install
Install with npm:
$ npm install artplayer
Or install with yarn:
$ yarn add artplayer
import Artplayer from 'artplayer'
Or umd build also available:
<script src="path/to/artplayer.js"></script>
Or from CDN:
<!-- jsdelivr -->
<script src="https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.js"></script>
<!-- unpkg -->
<script src="https://unpkg.com/artplayer/dist/artplayer.js"></script>
Will expose the global variable to window.Artplayer.
Usage
<div class="artplayer-app"></div>
let art = new Artplayer({
container: '.artplayer-app',
url: 'path/to/video.mp4',
})
Plugins
| Name | Describe | State |
|---|---|---|
| artplayer-plugin-danmuku | Danmuku (bullet comment) system | |
| artplayer-plugin-hls-control | HLS quality control | |
| artplayer-plugin-dash-control | DASH quality control | |
| artplayer-plugin-vtt-thumbnail | VTT thumbnail preview | |
| artplayer-plugin-multiple-subtitles | Multiple subtitles support | |
| artplayer-plugin-chromecast | Google Chromecast support | |
| artplayer-plugin-vast | VAST/VPAID advertising | |
| artplayer-plugin-chapter | Video chapters support | |
| artplayer-plugin-auto-thumbnail | Auto-generated thumbnails | |
| artplayer-plugin-ambilight | Ambilight effect | |
| artplayer-plugin-document-pip | Document Picture-in-Picture | |
| artplayer-plugin-audio-track | Independent audio track playback | |
| artplayer-plugin-jassub | ASS/SSA subtitle support | |
| artplayer-plugin-danmuku-mask | Danmuku masking (smart blocking) | |
| artplayer-plugin-asr | Automatic Speech Recognition | |
| artplayer-plugin-ads | Video advertising plugin | WIP |
Libraries
| Name | Describe | State |
|---|---|---|
| hls.js | HLS client | |
| dash.js | MPEG DASH player | |
| flv.js | HTML5 FLV Player | |
| mpegts.js | MPEG-TS/FLV Player | |
| webtorrent.js | Streaming torrent client |
Proxys
| Name | Describe | State |
|---|---|---|
| Canvas | Proxy video to canvas | |
| Mediabunny | Mediabunny proxy |
Changelog
Contributing
Donations
We accept donations through these channels:
QQ Group
License
MIT © Harvey Zhao


