Best practices for developing larger JavaScript applications [closed]

Development Environment
Well, you need a web server (depends on server-side architecture) like Apache or IIS to simulate the AJAX communication.
Sometimes an editor for javascript is included in the editor of the server-side development language.

There’s a interesting question about javascript IDEs:
https://stackoverflow.com/questions/209126/good-javascript-ide-with-jquery-support


Debugging Techniques & Profiling
Use built-in browser debugging and profiling tools like Firebug.

You can also look at this profiling tool.


Unit Testing
If jQuery is used I’d recommend http://docs.jquery.com/Qunit. In the development version of the javascrit application the javascript test files are loaded. When the application is published, the test files aren’t loaded.


Security

  • Validate and calculate everything on server-side
  • Prevent XXS

  • How to make a secure game in javascript?

  • Making AJAX calls secure


Design

Application——————————–

  • Application Components
  • Custom Widgets

Framework———————————-

  • Base Widgets
  • Base AJAX Communication
  • UI Core (Helper Methods…)

The framework provides the base functions. For example a base framework is jQuery and knockoutjs. And on top of this framework the application is built. Of course you can create your own framework for your application. But when choosing jQuery for example, you mostly don’t need to deal with cross-browser bugs, because jQuery makes that for you.


Communication with Server:
It’s a good idea to provide a RESTful Service for communicating. You also have to choose between JSON and XML. JSON is more lightweight than XML, so often JSON is elected.


Design Patterns: If the javascript application is really large, it’s a good idea to implement design patterns like MVC or MVVM.

There are some MVC/MVVM frameworks outside for javascript (knockoutjs for example).

This is a really useful article about design patterns in javascript: http://www.addyosmani.com/resources/essentialjsdesignpatterns/book/


But at the end you have to decide yourself how your application should be structured etc. The Design Patterns can show you a good way – but every application is different and not every solution works for all problems.

And don’t forget that performance is a big deal when using javascript. So compressing and combining javascript files is a good idea: http://code.google.com/intl/de/speed/articles/. At this point Lazy Loading might help, too.

Leave a Comment