What's the best way to use web application frameworks and libraries?

Selecting the right framework or library for your web development project is crucial. Consider these factors: - Start with what you need. Often, a simple static site generator may suffice. - Less is more. The more frameworks and third-party libraries you incorporate, the more complications you'll face in maintenance. - Assess the framework by its release frequency, community engagement, and longevity. Frequent updates can require continual adjustments. An active community often signals strong support and resources. Be cautious of frameworks that are simply the 'flavour of the month'; they might lack staying power.

In my experience, I have found that the first assessment of a project should define the choice of frameworks used. Will the application be heavy back-end and only API as the interface? Will it be a web application with mainly static content? Will the UX deliver on-the-fly operations that require ties to database resources? A slew of up front assessments will literate dictate a proper framework architecture. But as was stated, much of this is also very dependent upon skill, learning curve, and complexity.

As a developer, it's important to familiarise yourself with the appropriate tools to assist you with development and CI/CD pipeline. Knowledge of how to build code bundles with tools like Webpack or Esbuild are vital to building applications. A developer should be familiar with basic configuration and work on building an understanding of concepts like bundles, tree shaking, aliases and code splitting. Linting tools like Eslint assist developers with building high quality and tidy code which encourages good practice. Testing should be considered with tools like Jest for UI / Unit testing or Cypress for end to end testing.

Begin with DNS. Opt for HTTPS records, steering clear of redirects. Let TTFB be your guide; ensure responses are cached or static in nature. Minimise reliance on third-party domains and js. Employ early hints and link headers to your advantage, ensuring that initial content loads first. Serve webp & avif images. Be wary of external JavaScript for essential content. It can be the cause for blocking and layout shifts. Regularly monitor CrUX; its free RUM. Leverage the browser cache with cache-control. Pay attention to your database indexes and schema. It's often a bottleneck. Reduce the number of page AJAX requests. Implement REST APIs for efficient content delivery. Approach GraphQL cautiously; its caching challenges can be complex.

Web app security starts with IP blocklists, shielding your app by blocking requests from specific hosts and data centers, reducing exposure. Next, implement bot and automation detection. Most attacks are automated. A WAF alerts and blocks known exploits. Secure coding practices are essential. Incentivise your developers to prioritise security. Automated testing for vulnerabilities is another layer. Harden the hosting environment to reduce risks upon exploit. Access to data and databases must follow the principle of least privilege. Tools like OWASP Dependency Checker or SecureStack are useful for ensuring third-party libraries are not vulnerable. Rate limiting is important to prevent account takeovers and abuse.

Keep it simple. Refactoring overengineered code is the worst for legacy systems. It is recommended to implement and support as much complexity as it is needed to meet the requirements.