Dimension Music: A Free and Open-Source ACG PWA Music Player

What Is Dimension Music? A Music App Built for ACG Enthusiasts

"Dimension Music" (次元音乐) is a free, open-source music player designed specifically for ACG (Anime, Comics, Games) enthusiasts. Built with PWA (Progressive Web App) technology, it supports installation and use across multiple platforms including Windows, macOS, Android, and iOS. The project was developed as a full-stack application and serves as an interesting practice of the Vibe Coding philosophy, making it an excellent learning reference for beginner developers.

Core Features: Multi-Source Aggregation + Cross-Platform PWA Experience

Three Major Music Platform Integrations

Dimension Music currently aggregates resources from three mainstream music platforms:

• QQ Music (Penguin): Tencent's music resources
• NetEase Cloud Music: NetEase's music resources
• Bilibili (B站): Bilibili's audio resources

Multi-source aggregation refers to integrating music resources from multiple different platforms into a single application through a unified backend API layer. The technical implementation typically involves several key components: first, reverse engineering or official API integration for each platform to obtain song search results, details, and playback URLs; second, data format standardization, since different platforms return varying JSON structures, field names, and audio quality parameters that need to be mapped to a consistent data model on the backend; and finally, dynamic resolution of playback links, as many platforms' audio URLs carry time-sensitive signatures that require real-time fetching of valid links when a user clicks play. This architectural pattern is widely adopted in well-known open-source music projects like UnblockNeteaseMusic and YesPlayMusic, representing the classic technical approach for music aggregation applications.

It's worth noting that due to copyright restrictions, Dimension Music can only play free songs available on each platform — paid or VIP-exclusive content cannot be accessed. However, for everyday listening to ACG songs, covers, and doujin music, the coverage of free resources is already quite extensive. ACG music is a vast and active subcultural music ecosystem encompassing anime original soundtracks (OST), character songs, Vocaloid/virtual singer works, game music, covers, doujin music, and many other subcategories. Doujin Music refers to music created as derivative works based on existing properties, with deep traditions at events like Japan's Comiket. The Touhou Project series alone has spawned tens of thousands of doujin music works. In China, Bilibili is the core platform for ACG music creation and distribution, with numerous content creators publishing covers, arrangements, and original virtual singer works. Since this type of content is mostly released for free by individual creators with relatively relaxed copyright restrictions, this explains why Dimension Music maintains high coverage for ACG users despite only being able to play free songs.

Experience Advantages of PWA Technology

PWA, or Progressive Web App, is a web application paradigm that Google heavily promoted around 2015. Its core idea is to give web applications native app capabilities — including offline access, push notifications, and desktop installation. PWA relies on three key technologies: Service Worker (handling caching and offline logic), Web App Manifest (defining metadata like app name, icons, and launch behavior), and HTTPS (ensuring secure transmission). Compared to traditional desktop packaging solutions like Electron or Tauri, PWA doesn't require packaging binary files — users can complete installation directly through the browser, resulting in an extremely small application footprint. However, PWA also has limitations: restricted access to system-level APIs, and varying levels of PWA standard support across different browsers and operating systems, which is why Dimension Music recommends using Chromium-based browsers.

As a PWA application, Dimension Music offers several notable advantages in user experience:

• Installable to Desktop: Can be "installed" directly from the browser to your desktop or phone home screen, delivering a near-native app experience once opened
• Truly Cross-Platform: A single codebase covers Windows, macOS, Android, and iOS — no need to download different versions
• Extremely Lightweight: No need to download installation packages from app stores, with virtually no additional storage overhead

For browsers, Google Chrome is recommended for the best installation experience. Microsoft Edge, also based on the Chromium engine, works well too. Chromium is Google's open-source browser project and the technical foundation of Chrome. In 2018, Microsoft announced it would abandon its proprietary EdgeHTML engine and rebuild Edge based on Chromium, resulting in Chromium-based browsers now holding over 80% of the desktop browser market. Chromium offers the most complete PWA support, including full Service Worker lifecycle management, Web App Manifest parsing, and independent window execution. In comparison, Apple's Safari only began supporting PWA push notifications after iOS 16.4, but still has numerous limitations in installation experience and background execution; Firefox removed desktop PWA installation support in 2021 (retaining only mobile support). These differences directly impact the actual PWA experience. Therefore, Safari and Firefox have limited PWA support, and Chromium-based browsers are recommended.

Installation and Usage Guide

How to Install Dimension Music

The installation process is very simple, requiring just four steps:

1. Open Dimension Music's web address using Chrome or Edge browser
2. An install icon will appear on the right side of the browser address bar (you can also trigger it through the "Install App" option in the menu)
3. Click install, and the app will automatically be added to your desktop or app list
4. From then on, simply launch from the desktop icon — no need to manually open a browser

Daily Usage Experience

After installation, the app interface is clean and refreshing, with an overall visual style that caters to ACG aesthetics. Users can freely switch between the three music source nodes to search and play their favorite songs.

One small detail worth noting: in some system environments, PWA apps may have an issue where audio cannot be captured during screen recording. The root cause lies in the operating system's audio stream routing mechanism. Although PWA apps run in independent windows, their audio output is still managed through the browser process's AudioContext. On Windows, some screen recording software relies on application-level audio capture (WASAPI Loopback) to record sound from specific windows, but PWA audio streams may be attributed to the main browser process rather than the PWA's independent window process, preventing the recording software from correctly identifying and capturing it. The situation is similar on macOS, where system-level audio sandboxing mechanisms may also prevent third-party screen recording tools from accessing PWA audio output. Solutions typically involve choosing to record "system-wide audio" rather than "application audio," or using virtual audio devices (like VB-Cable) for audio routing. This is caused by PWA's audio output mechanism and is not a bug in the application itself.

Technical Highlights: Full-Stack Development + Vibe Coding Practice

A Full-Stack Learning Project Suitable for Beginners

As a complete full-stack project, Dimension Music covers multiple technical areas including frontend UI development, backend API aggregation, and multi-source data integration. With its clear project structure and moderate scope, it serves as an excellent practical reference for newcomers learning full-stack development.

Interest-Driven Code: Vibe Coding

This project embodies the Vibe Coding development philosophy — combining personal interests (ACG music) with technical practice, writing code in a relaxed and enjoyable state. The concept of Vibe Coding was coined in early 2025 by Andrej Karpathy (former Tesla AI Director and OpenAI co-founder) on social media and quickly went viral. He described Vibe Coding as an entirely new way of programming: developers no longer write code line by line but instead describe requirements to AI in natural language, letting large language models generate the code while developers only need to verify whether the results meet expectations. This approach dramatically lowers the barrier to programming, enabling non-professional developers to quickly build fully functional applications. In a broader interpretation, Vibe Coding has also been extended to mean a relaxed programming state driven by interest and intuition — not pursuing engineering perfection but enjoying the creative process. The Dimension Music project is a typical practice of this philosophy: infusing personal passion for ACG culture into technical implementation, completing development in a joyful flow state. This passion-driven approach to development often produces works with more warmth and soul.

Fully Open Source, Contributions Welcome

The project code is completely open source. Anyone can view the source code, study the implementation approach, or submit PRs to contribute. Whether in the ACG community or the open-source community, niche tools that deeply serve vertical domains have their unique value.

Summary: A Small but Beautiful ACG Music Solution

Dimension Music is a small but beautiful open-source project that cleverly combines PWA technology with ACG music needs, providing users with a lightweight, free, cross-platform music playback solution. Although limited to playing free songs due to copyright restrictions, it's more than sufficient for everyday listening to ACG songs, covers, and doujin music.

At the same time, as a full-stack learning project, Dimension Music's code structure and technology choices are worth careful study by beginner developers. If you love ACG music and are looking for a hands-on project to practice with, this project is a great place to start.