You might have noticed I had a video in the previous blog post and it didn’t seem to affect the page’s load speed, neither was it hosted on a 3rd party service like YouTube or Vimeo.
Pause, why should you do this exactly? I don’t know… privacy? Anyway
How did I do that?
First, I write these posts in Obsidian with my publishing workflow revolving around a handful of shell commands.
Why obsidian?
Because (1) it’s a cool app (2) I’ve customized and optimized it to do one thing well: write.
So, after my deep focus writing sessions in the environment built for it, I then record what it is I want to share with the world of my slightly funny life (with ShareX or Snipping Tool built into Windows).
Once I’m done with that, I paste the video into the note. This embeds it as:
![[note-title_video_1.mp4]]
(The video file is automatically renamed to the syntax above—via the Attachment Name Formatting plugin—and is moved to 40-Assets/images/)
Next, I run a shell command to compress the video because you don’t want to download 150MB of me yabbing about some random stuff.
Below is the compression command:
# change current directory to assets folder
cd "{{vault_path}}/40-Assets/images/"
# compress {{title}}_video_1.mp4 to {{title}}-compressed_video_1.mp4 via ffmpeg
ffmpeg -i "{{title}}_video_1.mp4" -vcodec libx264 -crf 23 -acodec aac -b:a 128k -map_metadata 0 "{{title}}-compressed_video_1.mp4"
# delete {{title}}_video_1.mp4`
Remove-Item -Path "{{title}}_video_1.mp4"
({{vault_path}} and{{title}} are variables automatically populated at runtime.)
Then I add a custom shortcode to where I’d place the video.
For example, this:
{{< html-video src="hello-world-compressed_video_1.mp4" type="video/mp4" >}}
Renders:
And there we have it!
Granted, this isn’t some mind-blowing workaround. It’s just something I was excited to try.
Wanna know what makes this even better? With a single command, I can also delete the compressed video, and other attachments from the vault, keeping it nice and small.