- #1. Reduce application size with Webpack
- #4. Use minification
- #5. Use Gzip compression
- #6. Use HTTP/2
- #7. Use pointer references
- #8. Trim your HTML
- #9. Use document.getElementById()
- #10. Batch your DOM changes
- #11. Buffer your DOM
- #12. Compress your files
- #15. Exclude unused components of .js libraries
- #16. Don’t forget var keyword when assigning a variable’s value for the first time.
- #17. Avoid the use of eval() or the Function constructor
- #18. Avoid unnecessary access to DOM
- #20. Limit library dependencies
#1. Reduce application size with Webpack
Elena Brown, a web developer at 1day2write and Write My X says- “Your web application will load faster and the user will have a better experience. Remove the unnecessary libraries or dependencies from your code that don’t serve any purpose.”
#4. Use minification
#5. Use Gzip compression
#6. Use HTTP/2
#7. Use pointer references
You can also cut down on DOM traversal trips by storing pointer references for in-browser objects during instantiation. If you don’t expect your DOM to change, storing a reference to the DOM or jQuery objects needed to create your page can help speed everything along. Alternatively, if you need to iterate inside a function, but you haven’t stored a reference, you can make a local variable with a reference to the object.
#8. Trim your HTML
Landon Wright. a business writer at Britstudent and PhD Kingdom advises- “The complexity of your HTML plays a large role in determining how long it takes to query and modify DOM objects. If you can cut your application’s HTML by half, you could potentially double your DOM speed.”
#9. Use document.getElementById()
Using jQuery lets you create specific selectors based on tag names and classes, but this approach necessitates several iterations as jQuery loops through DOM elements to find a match. You can speed up the DOM by using the document.getElementById() method instead.
#10. Batch your DOM changes
Every time you make DOM changes, batch them up to prevent repeated screen rendering. If you’re making style changes, try to make all of your modifications at once rather than applying changes to each style individually.
#11. Buffer your DOM
If you have scrollable DIVs, you can use a buffer to remove items from the DOM that aren’t currently visible inside the viewport. This technique helps you save on both memory usage and DOM traversal.
#12. Compress your files
#15. Exclude unused components of .js libraries
#16. Don’t forget var keyword when assigning a variable’s value for the first time.
Assignment to an undeclared variable automatically results in a global variable being created. Avoid global variables.
#17. Avoid the use of eval() or the Function constructor
Use of eval or the Function constructor are expensive operations as each time they are called script engine must convert source code to executable code.
#18. Avoid unnecessary access to DOM
Keep in mind that if you remove the value of the DOM then set the variable to NULL to avoid the memory leak in your application.
A CDN is not a panacea. For example, if your project is not worldwide and you opt to use a CDN that doesn’t have a local server in your country (e.g., the Russian Federation), this will increase a page load time. Using a CDN is supposed to make things run faster, but in certain cases, it can have the opposite effect. You can use Cedexis to generate reports that compare various CDNs to help you to decide which provider is most affordable for your use case.
#20. Limit library dependencies
Library dependencies add a lot to loading times, so strive to keep their use to a minimum, and avoid them entirely if at all possible. One way to reduce your dependency on external libraries is to rely more on in-browser technology.
Furthermore, if you need complex CSS selectors, try using Sizzle.js instead of jQuery. If you have libraries that contain just one feature, it makes more sense to just add that feature separately.
Note: This article was provided by Michael Dehoyos, who assists companies in their marketing strategy concepts, and contributes to numerous sites and publications. Also, he is a writer at Coursework Writing Service and a a web developer and editor at Essay Writing Service and Essay Help.