WashU Epigenome Browser update 2025

Abstract

The WashU Epigenome Browser (https://epigenomegateway.wustl.edu/) is a web-based tool for exploring genomic data and providing visualization, investigation, and analysis of epigenomic datasets. Since its 2018 update, the redesigned user interface and newly developed features have enhanced how investigators interact with both the Browser and the extensive genomic data it hosts. The rapid evolution of the JavaScript ecosystem has presented new challenges and opportunities in maintaining and developing the WashU Epigenome Browser. In this update, we present a completely rewritten codebase. This new codebase minimizes the use of external libraries whenever possible, resulting in a significantly smaller code bundle size after production compilation. The reduced code size improves loading efficiency and boosts the Browser's performance, with improved scripting, graphics rendering, and painting performance. Lowering external dependencies also allows for faster and more straightforward installation. Additionally, the update includes a redesign of the user interface to further enhance user experience and features a new modular design in the codebase that enables the Browser to be exported as stand-alone modules for use in other web applications. Several novel track types for long-read methylation data and single-cell methylation data visualization have been added, and we continue to update and expand the data hubs we host for major consortia. We constructed the first data hub to systematically compare genomic data mapped to different genome assemblies, focusing on comparisons between hg38 and the first human T2T genome, chm13, using our new comparative genomics track function. The WashU Epigenome Browser also serves as a foundation for other genomics platforms, such as the WashU Virus Genome Browser, developed for SARS-COV-2 research, the WashU Comparative Epigenome Browser, and the WashU Repeat Browser.

Graphical Abstract

Figure 1.

How to load the dog genome (canFam6) using the genome hub feature in the WashU Epigenome Browser. This feature allows users to seamlessly upload and visualize custom genomes without the need for preloading genome assembly information into the Browser system. (A) A screenshot of the Browser interface after successfully loading the canFam6 custom genome. (B) The user interface (UI) that enables users to upload a custom genome encoded in JSON format. (C) A quick preview of the JSON file structure, which includes required attributes such as a unique genome ID, genome name, and chromosome list. (D) The structure of the chromosome array, defining the individual chromosome information within the genome. (E) The structure of the default track object, which specifies which default tracks are displayed for the genome. (F) After the initial upload of the JSON file, the summary information that the Browser will display for the custom genome. (G) The complete schema of the custom genome JSON file, detailing optional attributes such as cytobands and public data hubs. Required attributes are marked with a star for clarity. The example JSON file schema is provided in Supplementary Note 1. The files for examples with minimal (canFam6) and extensive (hg38) genome information in JSON format are available in Supplementary Files S1 and S2, respectively.

Figure 2.

New caching strategy, dependency reduction, and performance enhancements. (A) The impact of the newly implemented caching strategy, which optimizes data handling by prioritizing recently fetched data using a LIFO queue. (B) The reduction in both the number of dependent packages and the total code bundle size. The Development Dependency panel lists the number of packages required for local development, while the Total Dependency panel reflects the overall number of packages these developmental dependencies rely on. The Bundle Size panel represents the total file size of the compiled JavaScript files. (C) Improvements in scripting, rendering, and painting performance as measured using web browsers’ performance testing tools (Google Chrome/Microsoft Edge). Three replicates provide consistent validation of these enhancements. Scripting refers to the time spent executing JavaScript code, rendering is the process of visually displaying the web page, and painting represents the conversion of webpage layout into actual pixels on the screen. Y-axis represents the time in milliseconds. The data hub for the test is included in Supplementary Note 2. The screenshots for the test are included in Supplementary File S3.

Figure 3.

Using the Browser as a module in your web application. By installing the package, users can easily import and render the Browser within their own software. There are multiple ways to use the package: (i) Loading a preloaded genome—By simply specifying the name of a preloaded genome, users can render the same genome as the one available in the Browser without additional configuration. (ii) Providing custom data—Users can include their own datasets by using the dataHub property, allowing the integration of specific genomic tracks for analysis. (iii) Using a custom genome—For users who wish to visualize custom genome assemblies, the customGenome property can be used. The syntax for defining a custom genome follows the same structure as described in Fig. 1. Supplementary Note 3 provides a step-by-step tutorial of how to run the Browser in a local computer and use the Browser as a module in another web application.

Figure 4.

New UI improvements. (A) The updated genome selection page now includes an instant search function, allowing users to quickly find genome assemblies by typing letters. The screenshot illustrates a search for the letter “h”, displaying matching genome assemblies. (B) The slide-in Apps menu is shown in the hg38 genome view, displaying several tracks from top to bottom: the ruler track, GENCODE version 47 gene annotation track, and the latest MANE (v1.4) gene selection track. This menu design allows users to manage their tracks while maintaining visibility of the genome browser. (C) The new session manager enables users to seamlessly switch between sessions from different genome assemblies without the need for manual file downloads. Sessions are stored locally in the browser for easier management. (D) The annotation tracks interface provides an improved layout for selecting and managing annotation tracks, making track configuration more intuitive. (E) The remote track addition interface now features a step-by-step guide, simplifying the process of loading external datasets into the Browser. (F) The mobile-friendly interface displays how the Browser adapts to mobile devices, with the hg19 genome loaded alongside the default Roadmap data hub. The responsive design ensures smooth interaction and visualization on smaller screens.

Figure 5.

Comparative epigenomics visualization and hub helper. (A) The GenomeAlign track, showcasing the genome alignment between hg38 and chm13 for comparative epigenomics analysis. WGBS data were aligned to both hg38 and chm13; alignment track was generated by pairwise alignment between hg38 and chm13. The rectangle box indicates an insertion in chm13. (B, C) methylGraph was applied to align WGBS data to the human pangenome graph, and then the alignment was subjected to the linear individual haplotype resolved genomes (maternal and paternal). The rectangle box in panel (B) indicates an insertion, and the big rectangle box in panel (C) indicates a missing L1HS element in the individual genomes. WGBS and methylGrapher tracks are displayed as methylC track [32]; the height of the blue bar represents the methylation percentage, while the black line indicates the coverage. refGene: reference gene annotation. Repeat Masker: repeats annotation from the RepeatMasker program. L1HS: human-specific subfamily of LINE-1 retrotransposons. (D) Workflow of the Hub Helper App. The Hub Helper App simplifies the process of creating and managing data hubs for the WashU Epigenome Browser. Users can provide URLs to their track files, and with a single click, the app generates a hub URL and uploads it to a cloud server that we host. Once the hub URL is created, an instant one-click link is provided, allowing users to immediately visualize their data in the Browser. Importantly, users’ data remain on their own servers—the Hub Helper App does not store private data. The generated hub URL is not public unless the user chooses to share it.