Javascript Reorganization
Our current situation is thus:
- Currently the javascript in Gitlab-CE is written as an inline
script
tag on an as needed basis for little bits of functionality. - Sometimes these
script
tags are put inside of a partial. In which case you would have multiple script tags on a page. - We use javascript for some things and coffee-script for other things.
- When we want to have things update on the fly from some sort of ajax call, one needs to write a fair amount of code for things like #4148 (moved). Where comments may be added at anytime in any order. While not impossible, it is not necessary.
- This also means that anytime we want to have similar functionality to #4148 (moved) on a different page we have to rewrite the code. Not very DRY.
A minimal fix:
- At a minimum (and disregarding any frameworks), the best way to fix this is to make sure that only one
script
tag exists per page. - Do not put
script
tags in partials, but keep them on the outer most layer. This would allow for variables and methods to exist between partials. Communication between partials would not be an issue.
The functionality of issues like #4148 (moved) and the code it involves is a problem that has already been solved many times over from libraries like react, angular, ember, marionette(with backbone), etc. The main benefit is having a DOM that automatically updates when models change.
There are two ways we could reorganize the javascript.
-
Each page becomes it's own "app", and we write a separate javascript "app" for each page. We use a library that allows for 2 way data binding, that automatically updates models when data changes. We use requirejs (or similar) to pull in our own functionality, and external ones, for drier code. Each framework has different ways of handling this. This way when someone clicks a page it still redirects (
HTTP GET
) to a new page. We will write the code in it's own scope so that someone can't modify variables from the javascript console. Each page maintains it's own state and on a full refresh of the page, that state is maintained. -
Gitlab-ce becomes one giant single page app. I do not suggest this approach, as I do not see any benefit to it, and it would be a massive rewrite.
I believe, that if implemented correctly the first approach would result in dry code.