# Portfolio site w/ Cockpit + Vue!

**URL:** <https://discourse.getcockpit.com/t/portfolio-site-w-cockpit-vue/2084>\
**Category:** Showcase\
**Created:** [September 30, 2021, 2:55pm UTC](https://discourse.getcockpit.com/t/portfolio-site-w-cockpit-vue/2084 "2021-09-30T14:55:43Z")\
**Posts on this page:** 1\
**Showing post:** 2

<div class="post-metadata">

**Author:** ![abernh](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.getcockpit.com/abernh/32/859_2.png) [@abernh](https://discourse.getcockpit.com/u/abernh)\
**Post date:** [October 1, 2021, 1:48pm UTC](https://discourse.getcockpit.com/t/portfolio-site-w-cockpit-vue/2084/2 "2021-10-01T13:48:18Z")

</div>

Nice one!  
Very clean DOM and refreshing page-switch-animation.

I’m surfing your website from Europe and it seems the images load a little slow, me being all the way under and over the big lake and stuff.  
But that made me think about the way you currently load your images. You directly show them as a normal `<img/>` tag, therefore loading the 1400px wide images also for a mobile view.

Suggestion: [use a `<picture/>` tag instead](https://alligator.io/html/picture-element/) in combination with [the `/api/cockpit/image` endpoint](https://discourse.getcockpit.com/t/thumbnail-url-for-each-entry-in-collection-inside-response/208/2) to serve different resolutions for your images for different screen sizes without any need of uploading different sizes.

Thanks for sharing and keep promoting Cockpit! 🙂

---

_[View the full topic](https://discourse.getcockpit.com/t/portfolio-site-w-cockpit-vue/2084)._