Is there a way to prevent content from loading on a particular screen sizes ?

The way I handle responsiveness on my site is that I used resposive tab and hide elements that shouldn't load on eather desktop, tablet or mobile.
In short
On desktop, content that is being created for mobile hides.
On mobile, content designed for desktop hides.
The problem is. Hiding elements doesn't prevent them from loading, which causes optimisation issues.
Is there a way to instead of only hide, completly prevent elements from loading on particular screen sizes?