primary-theme
[Enhancement] Make font embedding optional
I know this might be tricky to do or bothersome to support, but with the latest updates and richer font selection, the size of the obsidian.css increased a lot. I'm not 100% sure, but I think this might decrease performance, especially on mobile.
With the new options allowing font customizations, some people might have to suffer this performance penalty without even using those embedded fonts.
Making this optional would probably require maintaining two versions of the theme, which is a pain. But, on the other hand, it might be automatable, with some build script, as the necessary change is trivial and can be formally defined.
Another option could be getting rid of embedded fonts altogether and providing a link to some snippet generator where people could add the fonts they like to their config without adding the fonts they don't use. E.g., see Google Fonts and their shop-style import generator (you add fonts to your shopping cart, and then Google generates a CSS snippet that imports the selected fonts for you).
Hey there!! I really appreciate the concern and all the suggestions!!
Here's what I'm thinking:
- I don't think the theme's current state is making it sluggish on mobile. My phone is a low end Android smartphone that is going 4 years old (slow in general), and it's loading up just as fine as Minimal. I'm not trying to compare it against Minimal's really tiny size of <500kb, but rather I am talking in a real world sense. (If you wanna get technical with stats and all that jazz, I'm open ears!)
- In the coming months, after offering enough Style Settings, I'll minify the theme but also give access to an unminified version on the repo. I'll also be removing CSS comments in favor of SCSS since they don't compile on run. This should decrease filesize (in theory). I'm thinking that people who actually wanna fiddle around with the theme are more than happy to head over to the repo to get the stuff they need.
- I'm offering the said fonts because I want it to be accessible for users. Believe it or not, there are ton of people who'd rather use Obsidian just out of the box even if they are a developer. My partner is one of them. He doesn't even have a thing about PKM — all he knows is that Obsidian is great for writing, it has backlinks, and he likes my theme because he thinks it's cute and has different colors for emphasis 🤣 I had to recommend him to download Style Settings! And he's a better developer than I am! So, I'm really creating these options for people out there like him and I'm sure he's not the only one.
- My future concern is more for supporting other languages. I have notes to make with older and lesser known languages, and only Google provides fonts for them and even then they're all separated files. I can't embed all the different fonts! So I'm planning to make a wiki page for it. That page is for people who are in dire need of this support and are willing to take the extra steps needed for them to make it work. And even then, I might not recommend to embed said fonts unless needed, and would suggest a system install instead.
I really love the discussion you've created here. I'm interested in seeing what other stopperby's have to say so I'll keep this issue up!
Hi! I admit that I don't really notice any slowdowns. I was concerned about the cold start time, but I haven't seen any difference between Primary and the only other theme I use, California Coast. Obsidian is probably caching something pretty efficiently. Still, embedding too many fonts seems wrong to me 😅
Relying on the fonts installed on the device is bad anyway, as the user can't install fonts on a mobile device easily, neither on iOS nor on Android. But embedding everything good is also no good 😅
Does importing fonts from the web work in Obsidian themes? Theoretically, you'd need access to the internet, but only once, to allow the app to cache the font. You could embed only the default font (or even the basic glyph set of the default font) and then import the rest (other fonts, characters, or weights) from Google Fonts or another externally hosted place.
Won't be fixing this - but thank you for the input @dsent.
I have decided to stick to 4 embedded fonts: Inter, Karla, Quicksand, and Lora. Each give their own character and are fitting with Primary. I still want to add these presets to give users who don't like spending time to setup their workspace appearance a couple of in house options.
I will focus on giving other visual options to Primary's Style Settings in the coming update.
I have decided to stick to 4 embedded fonts: Inter, Karla, Quicksand, and Lora. Each give their own character and are fitting with Primary. I still want to add these presets to give users who don't like spending time to setup their workspace appearance a couple of in house options.
Thanks for the update! Embedding those 4 doesn't seem to affect anything much, so my original report is a non-issue anyway.
And, afaik, css snippets allow adding any custom extra web font that will work both on desktop and mobile. Having an option to add a custom font more easily (e.g. by putting a URL somewhere in Style Settings, so there's no need for tinkering with custom CSS) would be a nice addition, albeit not a dealbreaker.