I am about to create my first ‘mobile-first’ website and am unsure on the best way to conditionally load content as the viewport increases.
For example, lets say I wish to load a twitter feed only for desktop browsers, not mobile, how would I do this?
Option 1) Display: none – This is bad as content still loads for mobile
I’m not exactly a JS expert (basically a n00b really) but is there a reason why the content could be already sitting as a separate HTML ‘slug’ sitting on your web server waiting to be injected when the browser hits a certain width?
HMTL markup isn’t in the JS, it’s a div id on a ‘separate pgae’ waiting to be injected….if that makes any sense.
I was also asking as a general technique as I may wish to use this elsewhere.