[vflash]

Документация и исходники тут https://github.com/vflash/scmod

В свое время пробовал асинхронно загружать по требованию но переизбыток асинхронности усложняет код. Позже стал просто объединять файлы в один, а для описания связей использовал отдельные файлы. Программируя под nodejs оценил удобство когда каждый файл имеет свою область видимости.

Появилась идея сделать менеджер js-файлов в виде веб сервиса. Сервису указываем корневой модуль, а он формирует список файлов и отдает js код для подключения этих файлов через прокси который оборачивает исходник в функцию(свою область видимости) .

То как сделано в node.js на клиенте повторить не получиться, так как в ноде файлы грузятся синхронно по требованию. Потому для клиента необходимо вначале вычислять какие и в какой последовательность файлы нужно грузить. Если держать структуру модуля в js-коде(как в ноде), то для вычисления списка файлов потребуется загружать и парсить все эти файлы. Но это увеличивает общее время время загрузки страницы. Когда количество файлов в несколько десятков это становиться неудобно во время разработки. Поэтому и по опыту использования "отдельных файлов", в качестве структуры модуля выступает отдельный json файл.

Описание модуля выглядит примерно так

// какойто модуль /js/zzz
{
	"modules": {
		"core": "../core/core.json",
		"xxx": "./xxx.json"
	},
	
	"scripts": [
		"./common.js",
		"./code.js",
		"./init.js"
	]
}


// модуль обшего функционала  ../core/core.json
{
	"scripts": [
		"./core.js",
		"./core-cookie.js",
		"./core-xhr.js"
	]
}


// еще какойто модуль ./xxx.json
{
	"modules": {
		"core": "../core/core.json"
	},
	
	"scripts": [
		"./xxx1.js",
		"./xxx2.js"
	]
}

в результате должны быть подключены файлы:

/js/core/core.js
/js/core/core-cookie.js
/js/core/core-xhr.js

/js/zz/xxx1.js
/js/zz/xxx2.js

/js/zz/common.js
/js/zz/code.js
/js/zz/init.js

пропустив через прокси файл выглядит примерно так

http://scmod.vflash.ru/file/1/-,core,xxx/http/demo.com/js/zzz/common.js

__MODULE(1, function(global,module,core,xxx){.........код файла............
return [global,module,core,xxx]});

каждый модуль может состоять из нескольких файлов но каждый будет в своей области видимости. Общим для них будет переменная module. Её можно переопределить в любом файле модуля. К примеру module=fucntion(){....};

если нужен объект который будет общим для файлов модуля но недоступен другим модулям то структуре нужно создать связь с указанием пути как true

{
	"modules": {
		"core": "../core/core.json",
		"xxx": "./xxx.json",
		"ee": true
	},
	
	"scripts": [
		"./common.js",
		"./code.js",
		"./init.js"
	]
}

если нужен виртуальный модуль то так:

{
	"modules": {
		"core": "../core/core.json",
		"xxx": "./xxx.json",
		"vvv": "global:vvvv"
	},
	
	"scripts": [
		"./common.js",
		"./code.js",
		"./init.js"
	]
}

Если необходимо чтобы переменная "module" была названа по другому то в структуре необходимо указать:

{
	"alias": "ddd",
	"modules": {
		"core": "../core/core.json",
		"xxx": "./xxx.json",
		"vvv": "global:vvvv"
	},
	
	"scripts": [
		"./common.js",
		"./code.js",
		"./init.js"
	]
}

Где-то серьезно опробовать этот менеджер еше не приходилось. Написал прототип на node.js , но реализация такая только чтоб проверить и попробовать использовать.

В перспективе в структуре можно хранить и структуру CSS файлов.



Исходник сервиса тут https://github.com/vflash/scmod

Для пробы запустил сервис по адресу http://scmod.vflash.ru
подключать примерно так http://scmod.vflash.ru/sandbox?src=h...da/common.json
сборка в один файл выглядит так http://scmod.vflash.ru/scripts?src=h...da/common.json

код сырой потому уронить можно в три счета.