Hi, so like many other people in the comments, I built by portfolio using Gastby because it's super fast and gives all the speed benefits of optimising a static site. I've hosted it on Netlify. I've built it a couple of months ago and have been making tweaks here and there. It's still sort of a work in progress as I plan to keep building more projects.
Would love to get some feedback from you guys on how I could improve anything.
A Front-End Developer with a passion for learning how people work, the efficacy of good design, and a growing interest in the complexities of functional programming.
The portfolio site looks nice, but you lose a lot of the "above the fold" space with your angled image background. I think if you brought the text up with a white or semi-transparent background, it might alleviate that issue.
Full-time web dev; JS lover since 2002; CSS fanatic. #CSSIsAwesome
I try to stay up with new web platform features. Web feature you don't understand? Tell me! I'll write an article!
He/him
Hey Nikhil! It looks great overall, my one comments would be to create some lower resolution versions of your images. They take a long time to load, and they display on screen much smaller than the actual image is, so you don't need all that resolution.
For example, on your About Me page, your selfie took a full 2 seconds to load for me (and that's on desktop with a physical connection; I assume it would be longer on mobile). When I inspect the image itself, it's 1200x1200 pixels, but on the page it's sized to 150x150 pixels. If you created a scaled down version of the image that was only 150x150, or even a bit bigger so you can use it in more places, it would load a ton faster.
Additionally, you could decrease load time by using an app like squoosh.app to compress it. When I toss your 1200x1200 pixel selfie picture in there, I see I can use MozJPEG to compress it from 704KB to only 86KB, which would definitely load a ton faster and save some people a bunch of mobile data. And that's without first scaling down your image.
Otherwise, I think you've got a solid personal site!
I’m a full stack developer who has experience with several front-end tools like Reactjs, Vuejs, and jQuery as well as some back-end tools like PHP, Laravel, Node, and Express.
Location
IL
Education
AAS in Information Technology/Web Development
Work
Senior Software Development Engineer at Wizards of the Coast
I've never heard of squoosh. I usually use compressor.io for this. Are you using gatsby image to display images Nikhil? That should take care of a lot of the heavy lifting for you too.
Hey Ken, thank you so much for not only taking the time out to check out my portfolio but also for giving me such useful, actionable advice! I've reduced the sizes of my assets using the compression app you mentioned and I can see a very noticeable difference in image performance and load times. I'm just starting out and haven't really given much thought about optimising image load times but I can see how it makes the experience better and also consume lesser mobile data on slower networks. This is something that I will now keep in mind.
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
Hi, so like many other people in the comments, I built by portfolio using Gastby because it's super fast and gives all the speed benefits of optimising a static site. I've hosted it on Netlify. I've built it a couple of months ago and have been making tweaks here and there. It's still sort of a work in progress as I plan to keep building more projects.
Would love to get some feedback from you guys on how I could improve anything.
My Portfolio: nikhil.live
The portfolio site looks nice, but you lose a lot of the "above the fold" space with your angled image background. I think if you brought the text up with a white or semi-transparent background, it might alleviate that issue.
Hey Nikhil! It looks great overall, my one comments would be to create some lower resolution versions of your images. They take a long time to load, and they display on screen much smaller than the actual image is, so you don't need all that resolution.
For example, on your About Me page, your selfie took a full 2 seconds to load for me (and that's on desktop with a physical connection; I assume it would be longer on mobile). When I inspect the image itself, it's 1200x1200 pixels, but on the page it's sized to 150x150 pixels. If you created a scaled down version of the image that was only 150x150, or even a bit bigger so you can use it in more places, it would load a ton faster.
Additionally, you could decrease load time by using an app like squoosh.app to compress it. When I toss your 1200x1200 pixel selfie picture in there, I see I can use MozJPEG to compress it from 704KB to only 86KB, which would definitely load a ton faster and save some people a bunch of mobile data. And that's without first scaling down your image.
Otherwise, I think you've got a solid personal site!
I've never heard of squoosh. I usually use compressor.io for this. Are you using gatsby image to display images Nikhil? That should take care of a lot of the heavy lifting for you too.
Hey Ken, thank you so much for not only taking the time out to check out my portfolio but also for giving me such useful, actionable advice! I've reduced the sizes of my assets using the compression app you mentioned and I can see a very noticeable difference in image performance and load times. I'm just starting out and haven't really given much thought about optimising image load times but I can see how it makes the experience better and also consume lesser mobile data on slower networks. This is something that I will now keep in mind.