;_;
KPCKevin Powell - Community
•Created by ;_; on 11/11/2023 in #front-end
Locate element render delay in LCP
All I can think of is downloading all the icons that I'm using as svg and host them on CDN for faster loading, but I think using them in single variable font file would be better
34 replies
KPCKevin Powell - Community
•Created by ;_; on 11/11/2023 in #front-end
Locate element render delay in LCP
Do you maybe know how can I reduce it? It's already woff2 file
34 replies
KPCKevin Powell - Community
•Created by ;_; on 11/11/2023 in #front-end
Locate element render delay in LCP
Hello, I think I found one of the issues. It may be the MaterialSymbols font face. It weights about 3MB 🫣
34 replies
KPCKevin Powell - Community
•Created by ;_; on 11/11/2023 in #front-end
Locate element render delay in LCP
Yeah, like I said in the beginning of the post, once it shows performance 91, once 60, once 68, once 75 etc. it just feels like its random 😆
34 replies
KPCKevin Powell - Community
•Created by ;_; on 11/11/2023 in #front-end
Locate element render delay in LCP
I just uploaded it on netlify, I don't know why it's 68 now 🥲
34 replies
KPCKevin Powell - Community
•Created by ;_; on 11/11/2023 in #front-end
Locate element render delay in LCP
34 replies
KPCKevin Powell - Community
•Created by ;_; on 11/11/2023 in #front-end
Locate element render delay in LCP
I will have a look at it and maybe use it in future project
34 replies
KPCKevin Powell - Community
•Created by ;_; on 11/11/2023 in #front-end
Locate element render delay in LCP
I also heard about webpack, post-css and other cool things that would help me like minifying the CSS or copying files from src folder to public folder etc.
34 replies
KPCKevin Powell - Community
•Created by ;_; on 11/11/2023 in #front-end
Locate element render delay in LCP
I was wondering to learn Astro or React, but I think my knowledge about JS is too little for now 😆
34 replies
KPCKevin Powell - Community
•Created by ;_; on 11/11/2023 in #front-end
Locate element render delay in LCP
I heard about it and I think it's really nice. Especially for multipage applications, but at that moment I'm learning JavaScript, currently I finished only 1/3 of JS course that I am taking so I think I will try to learn some JS first and then look at the frameworks
34 replies
KPCKevin Powell - Community
•Created by ;_; on 11/11/2023 in #front-end
Locate element render delay in LCP
Thank you very much for your help
34 replies
KPCKevin Powell - Community
•Created by ;_; on 11/11/2023 in #front-end
Locate element render delay in LCP
Yeah it's plenty of work, when I was starting the project I didn't expect it to be that complicated hah
34 replies
KPCKevin Powell - Community
•Created by ;_; on 11/11/2023 in #front-end
Locate element render delay in LCP
I will try handle it, because I was hosting some files on the netlify in the past
34 replies
KPCKevin Powell - Community
•Created by ;_; on 11/10/2023 in #front-end
Website looks different in responsive mode than in real device
Ok, I have figured out everything, there was a problem with the width and height combined in media queries
5 replies
KPCKevin Powell - Community
•Created by ;_; on 11/10/2023 in #front-end
Website looks different in responsive mode than in real device
Hello, I found solution how to make padding-bottom to the button. It was my media queries, but I still can't manage the white space between sections. I am trying to resize the device in all the dimensions, heights, widths etc. on the firefox developer tools it looks fine, but when I launch it on my phone it still appears.
5 replies
KPCKevin Powell - Community
•Created by ;_; on 11/10/2023 in #front-end
Website looks different in responsive mode than in real device
Thank you very much!
5 replies
KPCKevin Powell - Community
•Created by ;_; on 8/22/2023 in #front-end
Why function does work different?
Ok, I just added the console.log on the event listener and it's triggering the counter() function multiple times. I'll use Intersection Observer. Thanks guys!
EDIT I just implemented the Intersection Observer and it works perfectly 
4 replies
KPCKevin Powell - Community
•Created by Hamza Naeem on 8/4/2023 in #front-end
What is Sass
sass is css preprocessor, it needs to be compiled to css. It's just like Jochem said, extension to CSS, it gives you ability to make nesting (very cool thing), mixins, functions, loops etc. It uses two syntaxes 1. .sass file 2. .scss file, the .sass file is quite different from css, you don't have the
; and {} so it's quite difficult to write code in some complex project. The .scss syntax is pretty much normal css, like 99% use the .scss6 replies