Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

artnv/client-threads

Folders and files

NameName
Last commit message
Last commit date

Latest commit

History

10 Commits

Repository files navigation

ClientThreads.js

Это библиотека для браузера на основе веб-воркеров, которая позволяет создавать множество независимых потоков без дополнительных GET запросов на сервер. Библиотека позволяет передавать функции в поток и получать обратно, с разной степенью вложенности, с массивами, объектами и функциями, что не предусмотрено стандартным функционалом.

  • Если вы передадите ссылку на DOM, window или на замыкание, то само-собой работать не будет.
  • Размер стека веб-воркеров ограничен

Для чего это нужно?

Можно сделать так и браузер не зависнет:

var thr = new ClientThreads({}, function(e) {
 var i=0;
 
 while(1) {
 i++;
 }
 
}, function (msg, e) {});	

Но лучше так не делать. Однако если вы откроете диспетчер задач то увидите как одно ядро на 100% будет загружено. В общем это многопоточность в JavaScript!

Как работает

  1. Создается виртуальная страница через blob, что позволяет не совершать GET запросы на сервер.
  2. В конструкторе и в воркере используются общие объекты/методы.
  3. Первым сообщением, в воркере происходит инициализация и запуск пользовательского кода, а последующие сообщения обрабатываются как обычные.
  4. Все сообщения конвертируются в строку, а после преобразуются обратно в код и на оборот. Поддерживается вложенность типов данных друг в друга.

Описание и использование

Создание нового треда/потока/воркера

var thr = new ClientThreads({
	/* Объект аргументов */
}, function(e) {
	/* Независимый поток */
}, function (msg, e) {
	/* Колбек. Вызывается всякий раз когда поступает сообщение из потока */
});	

Внутри потока и объект thread

Внутри независимого потока есть объект thread, который содержит:

  • thread.arguments - объект аргументов
  • thread.onMessage = function(msg, e) {} - Обработчик входящих сообщений. Первый аргумент msg содержит тот тип данных которые отправили, второй e.data всегда возвращает "string"

Свойства и методы доступные как внутри потока, в объекте thread., так и внешне, от конструктора

  • .close() - Завершение работы
  • .postMessage(message) - Отправка сообщений
  • .is - объект который содержит методы для проверки типов данных. Все методы возвращают true либо false. Они в основном используются внутри библиотеки
    • .object() - Если объект
    • .array() - Если массив
    • .string() - Если строка/текст
    • .function() - Если функция
    • .functionInTxt() - Если функция в строке и имеет тип "string"

Полный функционал

Не пугайтесь :), это всего лишь демонстрация как, что, откуда и где можно использовать.

var thr = ClientThreads({
	x: 10, y: 25
}, function(e) {
	
	/* Доступ к аргументам в потоке */
	var args = thread.arguments;
	console.log("Аргументы: "+(args.x + args.y)); // 35
	
	/* Получение сообщений */
	thread.onMessage = function(msg, e) {
	
		/* проверка типов данных */
		if(thread.is.function(msg)) {
			console.log( msg() );
		} else {
			console.log(e.data); // e.data в отличии от msg всегда возвращает "string"	
			
			if(msg == "close") {
				thread.close(); // завершение работы внутри потока
			}
		}
	};
	/* Способы отправки сообщений в колбек */
	thread.postMessage("<< Из потока. Первое сообщение");
	
	thread.postMessage([1, 3, function() {
		return "<< Из потока. Второе сообщение в виде функции которая в массиве";
	}]);
	
	/* return завершает работу и он так же, по завершению может отправить сообщение в колбек */
	return "<< Из потока. Третье сообщение в колбек"; 
}, function (msg, e) {
	
	if(thr.is.array(msg)) {
		console.log( msg[2]() ); 
	}
	
	if(thr.is.string(msg)) {
		console.log(msg);
	}
	
	// console.log(msg);
	
});	
thr.postMessage(">>>> В поток. Новое сообщение");
thr.postMessage(function() {return ">>>> В поток. Результат выполнения функции: " + (200+300);});
// thr.close(); 

Пример вложенности

/*
	1. Аргументы входят в поток.
	2. Часть аргументов отправляется обратно.
	3. В колбеке происходит выполнение функции.
*/
var thr = new ClientThreads({
	a: function() {
			function hhh() {function g() {return 3;}; return g()+1; }
			return hhh()+this.h;
	},
	h: "текст",
	g: 123,
	arr: [11,22,33, function() {return new Array(66,77, function(oo) {return oo;});}],
	obj: {h:{y:function() {return 67;}}},
	newF: [1,2,function() {return 1;},[33,'txt',function() {return 7;}, {f: new Array(function() {return 5;},4,5, {x:[function() {return 54;}]})}]]
}, function(e) {
	
	var res = thread.arguments.newF[3][3].f[3].x[0];
	thread.postMessage( res );
}, function (msg, e) {
	console.log( msg() + 100 ); // 154
});	

About

Библиотека для работы с многопоточностью в JavaScript, на клиентской стороне

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

Contributors

AltStyle によって変換されたページ (->オリジナル) /