# Obsidian - Optimize your Vault and Publish Site ![[images/Obsidian-Optimize-your-Vault-and-Publish-Site.webp]] [Watch on YouTube](https://www.youtube.com/watch?v=eZRj3CRTXGY) · 11:08 · Josh Plunkett · 2023-09-23 > Written from the video's full English captions, with chapter times from the description. Image Converter was described as still in development when this was recorded (September 2023), so check its current settings in Community plugins. ## Outline ### 00:00 Intro: the vault is getting massive - Today's topic is **vault optimization**, specifically **image optimization**. His Obsidian 5e vault's properties show it "just shy of 20 gigabytes," which is starting to worry him. - He backs up and **syncs his vault between multiple PCs with GitHub**, which has storage limits. He'd prefer to keep it free rather than pay for more storage, and shrinking images is one way to do that. - When he first launched his **Obsidian Publish** website, pages loaded slowly. The cause was **PNG files**: higher quality but much larger. He's now converting images to **WebP** or **JPEG**, which are smaller and load faster. - Most vault images don't need to be large, because they just sit in a note on screen. - The one exception is his **player view**. At the table he has a third screen on the wall behind his DM station, facing the players, and he right-clicks an image and opens it in a second window to send it there. That's the only place crisp images really matter. (An extra plugin was breaking that right-click option during recording.) ### 02:53 Image compare (the PNG baseline) - Goal: have images **optimized automatically when he pastes them** into a note. - He disables the plugin he's about to demo, grabs a sheet of NPC portraits from a quick Google search, and pastes it at the bottom of a note. The first one is a JPEG, so he finds a PNG instead. He apologizes that he can't credit the artist beyond the signature on the image. - **Reveal in system explorer**, then Properties: the PNG is **1.04 MB**. ![[images/Obsidian-Optimize-your-Vault-and-Publish-Site-t0440.webp]] *Windows Properties for the pasted PNG: "Pasted image 20230923101841.png", PNG File, size 1.04 MB, stored in the vault's z_Assets folder.* ### 04:48 Paste Image Png to Jpeg - In Community plugins, searching "jpeg" finds **Paste image Png to Jpeg** by musug, which he was using "up until this morning" and found worked nicely. - It converts an image to **JPEG** when you paste it, and has an **auto rename** option that names the file after the note you pasted into, plus a timestamp. ![[images/Obsidian-Optimize-your-Vault-and-Publish-Site-t0510.webp]] *The Paste image Png to Jpeg plugin page (by musug, about 4,100 downloads, version 1.0.4): "Screenshot png to jpeg and compress and rename," with its Png to Jpeg settings toggle below.* - He's moved away from it because JPEG is an older format that isn't used as widely anymore, so he turns it off. ### 06:03 Image Converter - Next: **Image Converter** by xRyul. It looks like it's still in development, but the developer has published research on different **compression rates and quality loss** (when you make an image smaller, you can lose quality). - He likes the README's summary and conclusion because "I'm not a tech image guy." The research recommends **WebP**: the best compression ratio, so the smallest files, with the least loss when converting. ![[images/Obsidian-Optimize-your-Vault-and-Publish-Site-t0640.webp]] *Image Converter by xRyul (installed) in Community plugins, next to the README's Conclusion: WebP gives significant size reductions while keeping high quality, PNG-to-WebP at quality 50 cuts file size by over 90%, plus a to-do list (HEIC/TIF/PSD/AVIF support, resize features, better compression algorithms). Export Image by Zhou Hua also appears in the search.* - With it enabled, he pastes the same image again. It's converted to **WebP** straight away, and it also does the **auto-rename** he liked, using the note name ("Chapter 11 - Death to the Wyrmspeakers") plus the date and a timestamp. - System explorer shows the new file at about **72 KB** (70.2 KB, 72.0 KB on disk), down from 1.04 MB ("there's 1,000 kilobytes in a Meg… taking me back to my nerd school days"). The video description puts it at a 93% reduction. ![[images/Obsidian-Optimize-your-Vault-and-Publish-Site-t0805.webp]] *Windows Properties for the converted file, "Chapter 11 - Death to the Wyrmspeakers…" (an IrfanView WEBP file): 70.2 KB, 72.0 KB on disk.* - Side by side in the vault, the PNG on the left and the WebP on the right, he can barely tell the difference. Opened in the player window, it's still "very acceptable." ![[images/Obsidian-Optimize-your-Vault-and-Publish-Site-t0850.webp]] *The sheet of four NPC portraits pasted twice in the Chapter 11 note: the original PNG on the left and the WebP copy on the right.* - Another feature: you can **resize images by dragging with your mouse**. - That's it: install the plugin, and everything you paste is shrunk and saved as WebP, which brings the vault size down a lot and gives faster load times on an Obsidian Publish site. ### 09:25 Outro - Thanks to the artist of the NPC portraits ("I wish I could draw like this"). "Nice, short, sharp and shiny." - Like and subscribe. For help, go to obsidianttrpgtutorials.com and its **Community and Support** section, which links to the **Obsidian TTRPG Community Discord**, a large, active community where you can get help and share what you know. ## Things mentioned ### Obsidian plugins and features - **Image Converter** by xRyul: converts pasted or dropped images (here to WebP), auto-renames them after the note with a timestamp, and lets you resize images by dragging; README includes compression research (**free**). His pick. - **Paste image Png to Jpeg** by musug: converts pasted PNGs to JPEG, with compression and auto-rename after the note name (**free**). He used it before switching. - **Export Image** by Zhou Hua: appeared in his plugin search but wasn't discussed (**free**) - A second-window / open-image plugin he uses to send images to the players' screen (not named in this video; see [[Obsidian - Image Window]]) - **Reveal in system explorer**: Obsidian's right-click option for finding the file on disk - [Obsidian Publish](https://obsidian.md/publish): his website, which loads faster with smaller images (**paid**) - Related notes: [[Obsidian - Lets Talk About Backups]], [[Obsidian Sync - Sync notes between PC and Mobile]], [[Obsidian - Dataview Publish Plugin]] ### Image formats - **PNG**: high quality but large (1.04 MB in his test) - **JPEG**: smaller, but an older format he's moving away from - **WebP**: the format the Image Converter research recommends for the best compression with the least loss (about 72 KB in his test) ### Websites, tools and services - [Obsidian](https://obsidian.md/) (**free** core app) - **GitHub**: how he backs up and syncs his vault between PCs; he wants to stay within the free storage (**free** tier, **paid** for more) - **Google** image search: where he found the NPC portraits used for testing - **Windows File Explorer** Properties: used to compare file sizes - [Obsidian TTRPG Tutorials](https://obsidianttrpgtutorials.com) and its Community and Support page (**free**) - **Obsidian TTRPG Community Discord** (**free**) - [Josh Plunkett Patreon](https://www.patreon.com/JPlunkett) (**paid**, optional; linked in the description) ### TTRPG context - His **Obsidian 5e vault** (D&D 5e campaign), including the note "Chapter 11 - Death to the Wyrmspeakers" - His table setup: a third screen on the wall behind the DM station for showing players images ### Free vs paid (quick) - Free: Obsidian core, Image Converter, Paste image Png to Jpeg, GitHub's free tier, his tutorial site and the Discord - Paid: Obsidian Publish, extra GitHub storage if the vault grows too large, optional Patreon ## Bios - **Josh Plunkett**: Australian GM and educator behind Obsidian TTRPG Tutorials (YouTube and obsidianttrpgtutorials.com). He runs his D&D 5e campaigns from an Obsidian vault synced with GitHub, publishes his tutorial site with Obsidian Publish, and supports the channel through Patreon. Here he's tackling a vault that has grown to nearly 20 GB. - **xRyul**: Developer of the **Image Converter** community plugin. Josh credits the plugin's README research on compression and quality loss for his choice of WebP. - **musug**: Developer of the **Paste image Png to Jpeg** community plugin, which Josh used before switching to Image Converter.