Overview
The article discusses LinkedIn's transition from server-side templates like JSPs to client-side templates using dust.js, emphasizing improvements in performance, developer productivity, and the ability to share UI code across different tech stacks. It highlights the challenges faced with a fragmented stack and the benefits of adopting a unified rendering layer.
What You'll Learn
1
How to implement client-side templates using dust.js
2
Why migrating from server-side to client-side templates can enhance performance
3
When to use JSON for dynamic data in client-side rendering
Prerequisites & Requirements
- Understanding of server-side and client-side rendering concepts
- Familiarity with JavaScript and JSON
Key Questions Answered
What are the benefits of using dust.js for client-side templating?
Dust.js templates provide significant advantages such as caching via CDNs, improved performance through precompiled JavaScript functions, and the ability to share UI code across different tech stacks. They also emphasize a clean separation of presentation from application logic, making them easier to maintain and extend.
How did LinkedIn address the challenges of a fragmented tech stack?
LinkedIn faced difficulties in reusing UI code due to multiple server-side technologies like JSPs, GSPs, and ERBs. By adopting a unified client-side rendering approach with dust.js, they were able to streamline development and enhance code reusability across different applications.
What criteria were used to evaluate client-side templating technologies?
The evaluation of 26 templating technologies was based on factors such as DRY principles, maturity, open-source status, ease of learning, documentation quality, flexibility, and performance. Dust.js emerged as the preferred choice after extensive testing.
Technologies & Tools
Frontend
Dust.js
Used for client-side templating to enhance performance and code reusability.
Backend
Java Servlet
Original technology stack used for rendering pages before migrating to client-side templates.
Key Actionable Insights
1Adopting client-side templates can significantly improve your application's performance and user experience.By moving rendering logic to the client-side and using dust.js, you can leverage caching and reduce server load, which is particularly beneficial for high-traffic applications.
2Consider using JSON for dynamic data exchange between the server and client to streamline your rendering process.This approach allows for faster page loads and a more responsive user interface, as the server only needs to send the necessary data instead of complete HTML pages.
3Evaluate multiple templating technologies before making a decision to ensure you choose the best fit for your project.The article highlights that LinkedIn assessed 26 different technologies, which underscores the importance of thorough evaluation in achieving optimal results.
Common Pitfalls
1
Failing to properly evaluate the compatibility of templating technologies with existing systems can lead to integration issues.
It's crucial to ensure that the chosen technology can work seamlessly with your current tech stack to avoid unnecessary complications during implementation.
Related Concepts
Client-side Rendering
Javascript Templating
Performance Optimization Techniques