Hey there fellow web enthusiasts! Join the channel here ru-vid.com/show-UCNAp3ihoUg5jlbr_vCEZ3MAjoin If you're passionate about web development like I am, then you've come to the right place! Subscribe to my channel and join on this epic journey to master Websites. Together, we'll build amazing websites, crush bugs like the Dark Knight, and create web experiences that'll make the Joker green with envy. So what are you waiting for? Hit that subscribe button and let's make the web a better place, one line of code at a time! tinyurl.com/DontclickWINK
I have drop down list of 197 country . The Page Speed show this error: Please Select Afghanistan Albania Algeria Andorra Angola Antigua and Barbuda Ar… How can I solve an Excessive DOM size?
A pattern appears that DOM size is affected by the amount of tags, as well as the embedded links to other pages or sites within the content. Is that accurate?
Yes true, try to crate the page keeping in the mind no to use lot if elements. it is possible to do that as I shown in the example. Another examples could be not using the mega menus as they are huge in elements. For ecommerce instead of a cart show in click, redirect users to the card page directly.
Thanks for the comment, it is a slider plugin I just shown for example. I would not suggest you to buy that one as there are many free plugins available to create sliders.
hello here if some things you can do in shopify to reduce DOM size 1. Optimize Shopify Theme Choose a Lightweight Theme: Select a Shopify theme known for its performance and minimalistic design. Minimize Theme Customizations: Avoid excessive customization that can add unnecessary elements to the DOM. 2. Clean Up Your Liquid Templates Remove Unused Sections: Delete any sections or snippets that are not in use. Simplify Liquid Logic: Simplify complex Liquid logic and loops to minimize the number of elements rendered. 3. Optimize HTML Structure Reduce Nested Elements: Avoid deeply nested HTML elements as they increase the DOM size. Use CSS Instead of Inline Styles: Use CSS classes and external stylesheets instead of inline styles to keep the HTML clean. 4. Manage Apps and Plugins Audit Installed Apps: Regularly review and remove any unused or unnecessary apps. Optimize App Usage: Ensure that the apps you use do not inject excessive HTML elements into your pages. 5. Optimize Images and Media Use Responsive Images: Implement responsive images to ensure only necessary image sizes are loaded. Lazy Load Images: Implement lazy loading for images to reduce the initial DOM size and improve loading times. 6. Minimize JavaScript and CSS Minify and Combine Files: Minify JavaScript and CSS files and combine them to reduce the number of requests. Load Scripts Asynchronously: Load non-critical scripts asynchronously to improve the rendering speed. 7. Use Efficient Liquid Code Limit For Loops: Avoid excessive loops that can add numerous elements to the DOM. Conditional Logic: Use conditional logic to render only necessary elements based on the context. 8. Optimize Collection and Product Pages Limit Products Per Page: Reduce the number of products displayed per page to decrease the DOM size. Paginate Content: Use pagination effectively to split content across multiple pages rather than loading everything at once. Example: Simplifying Liquid Code Here's an example of how you can simplify Liquid code to reduce DOM size: Before Optimization liquid {% for product in collections.all.products %} {{ product.title }} {{ product.description }} {% endfor %} After Optimization Limit the number of products displayed and use a simpler HTML structure: liquid {% for product in collections.all.products limit: 10 %} {{ product.title }} {% endfor %} Summary Reducing the DOM size in your Shopify store involves optimizing your theme, cleaning up your Liquid templates, managing apps and plugins, optimizing images, and minimizing JavaScript and CSS. Regularly review your site's structure and content to ensure it remains lean and efficient. By implementing these practices, you can significantly improve your site's performance and user experience.
Seems like you haven't seen watched the videos carefully. I covered everything that what is DOM size and how you can reduce it. Along that I covered elementor as an example too. And I don't understand why you said that you should buy elementor, where specifically I recommended not to use elementor but use a lightweight free page builder like Gutenberg. Also elementor is free to use. I don't have your website url but watch the video again and try to reduce the page size my adding nodes carefully, do not nest the nodes inside each other. If you have some specific questions other then allegations then I will be superhappy to help you out. This channel is all about helping people as a by product If I make some money that is a plus. I would never adverstize anything I don't believe in. Good luck and let me know if you want a genuine help.
hey brother, I arranged wordpress home screen in admin panel and today I found that their position is changed which was not done by me. Is it possible that they can change theirt position automatically
hey brother, sorry for late reply. no - it does not happen automatically. check if some else have the access to the site. change passwords and set up wordfence and antimalware plugin on the site. check my channel for wordfence and antimalware videos. let me know if you found something.
what about the problem statement and understanding what is DOM size and what are nodes ? Do you think that is not important, just want your feedback so that I can improve my videos.
@@LetsCreateYourWEBSITE hey! how r u. i absolutely loved and liked your video. i even subscribed also. but u took too much time brother. repeated same things many times. anyway thanks for the video. 😇
![How to FIX Avoid an excessive DOM size [SOLVED]](/img/logo.svg){kind=logo}
