Search DaniWeb - angular

Re: How to Implement Lazy Loading for Faster Web Portals 2 Days Ago by scope_2 Lazy loading enhances web portal speed by loading images, videos, or components only when needed. Add loading="lazy" to <img> and <iframe> tags for simple use. For advanced control, use libraries like Lozad.js or lazysizes. In frameworks like React, use React.lazy() and <Suspense>. Avoid lazy loading above-the-fold … Re: How to Implement Lazy Loading for Faster Web Portals 2 Days Ago by gediminas.bukauskas.7 Here is a problem: Blazor WEB application working in SSR mode performs partial update of the page after posting. JS initialization does not work in this case. It is difficult to find correct event for performing JS operations. Re: How to Implement Lazy Loading for Faster Web Portals 2 Weeks Ago by Pelorus_1 By loading images and content only when necessary, lazy loading speeds up web portals. Implement JavaScript or frameworks like React with dynamic imports, and use loading="lazy" for images. How to Implement Lazy Loading for Faster Web Portals 2 Months Ago by KamalDeepPareek How can lazy loading improve web portal performance by reducing initial load times and optimizing resource usage? What are the best techniques to implement lazy loading in images, components, and data fetching using JavaScript frameworks like React, Vue, and Angular? How does lazy loading impact SEO and user experience? Re: How to Implement Lazy Loading for Faster Web Portals 1 Month Ago by gediminas.bukauskas.7 … JS and CSS. I don't know about React, but Angular is clearly too big. Pack loadable items into bundles and… Re: How to Implement Lazy Loading for Faster Web Portals 2 Months Ago by Dani Hello, The easiest way to implement image lazy loading is by simply adding the `loading="lazy"` HTML attribute to `<img>` image tags. That will not load the image until it is about to come into view in the web browser as the user scrolls down the page. Something else that we do here at DaniWeb is to use the `async` and `defer`… Re: How to Implement Lazy Loading for Faster Web Portals 1 Month Ago by jkon The loading="lazy" HTML attribute-value pair was introduced in 2019–2020, so I would guess it will be safe to use after 2030–2035, except if you don't care about internet visitors and are targeting an intranet of a company where you control the browsers and their versions. Of course, lazy loading impacts SEO. Modern SEO has more to do … Re: How to Implement Lazy Loading for Faster Web Portals 1 Month Ago by Dani > The loading="lazy" HTML attribute-value pair was introduced in 2019–2020, so I would guess it will be safe to use after 2030–2035, except if you don't care about internet visitors and are targeting an intranet of a company where you control the browsers and their versions. According to [Can I Use](https://caniuse.com/?search=… Re: How to Implement Lazy Loading for Faster Web Portals 1 Month Ago by jkon Dani, in my small software company (we are only five people), we have a rule for the web: support it until the problem affects less than 1 in 200 users, or 0.5%. We waited 10 years for Internet Explorer to reach this threshold, and finally, in 2025, we no longer program new web apps to support Internet Explorer. This is a liberating moment for … Re: How to Implement Lazy Loading for Faster Web Portals 1 Month Ago by Dani The reason why I disagree with you is because I do not see a reason to not use a performance optimization that will benefit 96% of web users, and degrade gracefully and cause absolutely no side-effects for the remaining 4%. What is the harm in using it in production *now*? I especially disagree with you because this is a performance optimization… Re: How to Implement Lazy Loading for Faster Web Portals 1 Month Ago by Dani > On "Can I Use," IE was supposedly "dead" in 2013 I'm not sure what you mean by that? I see it saying that IE is still in use by 0.4% of web users. It is up to *you* to determine if that is an acceptable loss. I don't think they make that determination for you because, as pointed out in my previous post, a performance … Re: How to Implement Lazy Loading for Faster Web Portals 1 Month Ago by jkon In reality, the usage of IE is lower than 0.4%. In some categories of web apps, it's around 0.1%, while in others, it's about 0.2%. That is why we decided to stop supporting IE from 01/01/2025. If it were above 0.5%, you shouldn’t even consider introducing something without first testing it in Internet Explorer. I can't understand how any app can … Re: How to Implement Lazy Loading for Faster Web Portals 1 Month Ago by Dani I think perhaps we are misunderstanding each other. Of course, it's important to not introduce any breaking functionality for any percentage of users. However, what is the harm in adding `loading="lazy"` to an existing web app? 96% of users will experience a performance improvement. The other 4% of users will have no negative … Re: How to Implement Lazy Loading for Faster Web Portals 1 Month Ago by jkon > However, what is the harm in adding loading="lazy" to an existing web app? 96% of users will experience a performance improvement. The other 4% of users will have no negative consequences, and everything will be exactly the same for them. That 4% will not lose any functionality. That 4% will not experience any UI/UX consequences or … Re: How to Implement Lazy Loading for Faster Web Portals 1 Month Ago by Dani I guess I don't understand why implementing `loading="lazy"` will hurt the CLS if you're only doing it for images below the fold, and always specifying image dimensions (which would ensure to never affect CLS at all)? Re: How to Implement Lazy Loading for Faster Web Portals 1 Month Ago by jkon Yes I couldn't get the CLS impact either. I understand the "speed index" SEO impact of using loading="lazy" (that in my mind make it not usable) vs using IntersectionObserver but not the CLS. I created one more test that now it looks like the the speed index impact is there , but the CLS impact is negligible (now I see a really … Re: How to Implement Lazy Loading for Faster Web Portals 1 Month Ago by Dani Even if using it above the fold, as long as you specify image dimensions, there should never be a CLS impact. CLS measures needing to reposition elements on the page as it loads or due to user interaction. As long as the spot for the image is carved out from the very beginning, even if the image loads much later, no other element on the page … Re: How to Implement Lazy Loading for Faster Web Portals 1 Month Ago by Dani Speed index should also not be affected at all by using it. Speed index measure how long it takes to load the first screen of content of a webpage. That means that if you’re using it only for content below the fold, speed index should never be affected. Re: How to Implement Lazy Loading for Faster Web Portals 1 Month Ago by jkon Dani as you wrote "Speed index" is supposed to be about the visible part of a web page - ATF. But because in Lighthouse I kept getting that loading="lazy" method had worse "Speed index" I created two simplified html pages for test. I gave a lot of height of what "Above the fold" is supposed to be , 940px … Re: How to Implement Lazy Loading for Faster Web Portals 1 Month Ago by Dani I would like to confirm that the JS version is giving me an LCP of 0.2s and the `loading="lazy"` version is giving me an LCP of 1.1s, so certainly a huge difference there. FCP, total blocking time, CLS (0), and speed index (0.2s) scores are the same for both. I admit that, at first glance, I'm not understanding why the LCP is so long … Re: How to Implement Lazy Loading for Faster Web Portals 1 Month Ago by Dani Actually, I take it back. I assume that, using Chrome on a fast Internet connection, and a super high screen resolution, none of the images are actually being lazy loaded. Re: How to Implement Lazy Loading for Faster Web Portals 1 Month Ago by Dani Sorry. I’ve just been really exhausted all day. It just clicked that LCP is only for ATF. Soooo, yeah, I don’t know what’s going on there. Re: How to Implement Lazy Loading for Faster Web Portals 1 Month Ago by jkon As I wrote in a previous post, I believe that the way loading="lazy" is being implemented in browsers makes it almost unusable. Chromium-based browsers have a really high distance from viewport threshold, loading many images simultaneously upon page entry, while Firefox has a really low threshold, which means the user experience is awful.… Re: How to Implement Lazy Loading for Faster Web Portals 1 Month Ago by Dani > Lighthouse metrics (which really affects SEO) Please correct me if I'm wrong, but I'm fairly confident that Lighthouse metrics do not affect SEO. Lighthouse is just a tool that Google offers to SEOs to be able to offer actionable page improvements. In reality, it's real world performance data from Chrome users that factors into a site's SEO… Re: How to Implement Lazy Loading for Faster Web Portals 1 Month Ago by jkon Dani, I completely agree (of course) that Lighthouse, as a tool, doesn’t directly impact SEO rankings. However, Core Web Vitals , which Lighthouse helps measure , do influence Google’s ranking signals. If a webpage performs poorly in Lighthouse audits for metrics like LCP, Speed Index, CLS, e.t.c. those issues will also affect real Chrome users, … Re: How to Implement Lazy Loading for Faster Web Portals 1 Month Ago by Dani > If a webpage performs poorly in Lighthouse audits for metrics like LCP, Speed Index, CLS, e.t.c. those issues will also affect real Chrome users, ultimately having a negative impact on its SEO. I have found that to not be the case. As an example, we use Google's signed exchanges, which allow Chrome to prefetch our URL on the Google SERPS … Re: How to Implement Lazy Loading for Faster Web Portals 1 Month Ago by jkon Hello Dani, I decided last week not to respond to your last post, but, let's be honest, I can't keep myself from responding. Your example could be valid if you take into account: What percentage of websites/web apps use SXG? Of those, what percentage of the indexed pages by Google are actually cached by Google at any given moment? Of … Re: How to Implement Lazy Loading for Faster Web Portals 1 Month Ago by Dani > Is your example valid? Yes, if you stretch a fringe and long-shot possibility into an opinion. My post was based on my own use case, which is the only data that I have access to. > What percentage of websites/web apps use SXG? DaniWeb uses SXG. > Of those, what percentage of the indexed pages by Google are actually cached by… Re: How to Implement Lazy Loading for Faster Web Portals 1 Month Ago by Dani > If a webpage performs poorly in Lighthouse audits for metrics like LCP, Speed Index, CLS, e.t.c. those issues will also affect real Chrome users, ultimately having a negative impact on its SEO. Basically what I was saying was that I found that to not be the case with my own website. Like I said, half the time SXG makes what I see in … Re: How to Implement Lazy Loading for Faster Web Portals 1 Month Ago by jkon Dani, first of all, thank you for sharing the numbers. Yes, if LCP for mobile devices has improved from 3 seconds to 2.1 seconds (with SXG being the only difference), it’s clear that SXG is working well for DaniWeb. 232,000 crawl requests for an SXG certificate over the past three months for 207,000 pages is negligible. Your SXG certificates …