uid.me — сервис личных страниц (технические детали inside)

в 9:56, , рубрики: javascript, mojolicious, mongodb, mongodb sharding, nosql, perl, ucoz, асинхронное программирование, Блог компании uCoz, Веб-разработка, Социальные сети и сообщества, метки: , , , , , , ,

Добрый день!

Мы хотим сделать обзорный пост, посвящённый нашему новому проекту. Обзор затронет как функционал, так и техническую часть, надеемся, это сделает статью интересной как профессиональным разработчикам, так и тем, кто читает Хабр с целью держать руку на пульсе Технологии.

Тем, кому интересна только техническая сторона проекта — рекомендуем сразу перейти ко второй части.

ЧАСТЬ 1. Лирическая

Мы — это команда разработки сервиса личных страниц uid.me.
Личная страница — это, например, вот так:

uid.me — сервис личных страниц (технические детали inside)
http://uid.me/dikaya

uid.me — сервис личных страниц (технические детали inside)
http://uid.me/pavel_kudinov

Тем, кто не знаком с западным аналогом нашего сервиса, следует признаться: проект uid.me начинает свою историю как клон-локализация англоязычного сервиса about.me

История создания

Дело было так. Компания сайт-билдер uCoz, в которой мы трудимся, за 8 лет существования накопила в недрах своих дата-центров более 35 млн профилей, созданных веб-мастерами, а также многочисленными посетителями созданных веб-мастерами сайтов, форумов и блогов.

Всех этих людей объединяет глобальная система авторизации uID:

uid.me — сервис личных страниц (технические детали inside)

До сегодняшнего дня каждый человек, зарегистрированный в uCoz, имел профиль такого вида:

http://3707164671.uid.me/

uid.me — сервис личных страниц (технические детали inside)

Проект about.me был выбран как лучший существующий прототип индивидуальной страницы для каждого пользователя uCoz, отвечающий, на наш взгляд, современному тренду самовыражения обитателей Сети начала XXI века.

Как и в случае about.me, мы даём пользователю:

1. Ставший правилом хорошего тона URL вида uid.me/имя_фамилия, который вполне можно использовать для печати на визитной карточке, указать в качестве домашней страницы в skype, а также упоминать на любом медиа-носителе.

2. Возможность объединить в единый визуальный образ личное фото, фоновое изображение в высоком разрешении, основную информацию о себе (такую как биография и сфера интересов).

3. Конструктор, с помощью которого можно быстро и увлекательно придать своей личной странице уникальный вид и общую визуальную согласованность.

uid.me — сервис личных страниц (технические детали inside)uid.me — сервис личных страниц (технические детали inside)
uid.me — сервис личных страниц (технические детали inside)uid.me — сервис личных страниц (технические детали inside)

4. И, наконец, самое интересное: сегодня многие из нас активно присутствуют в социальных сетях. Кому-то ближе форматы Facebook и Вконтакте, кто-то ограничивается микроблогами Twitter и Instagram, кое-кто имеет свой популярный канал на Youtube.

И здесь справедливо правило — чем большую социальную активность проявляет человек, тем острее встаёт вопрос: “какую из социальных сетей считать “главной”?”.

Мы предлагаем использовать uid.me в качестве своеобразной личной визитной карточки онлайн. Наш сервис позволяет привязать к собственному профилю наиболее распространённые социальные сети, и тогда не придётся выбирать — какую именно ссылку дать при новом ценном знакомстве, указать в профиле skype или поставить в подпись на форуме.

Ваши посты, твиты и фотографии будут автоматически появляться в вашем профиле, причём для отображения будет использован общий вид, а функция “поток” создаст общую ленту событий, объединяя в хронологическом порядке всё происходящее с вами.

uid.me — сервис личных страниц (технические детали inside)

Кстати, если вы захотите создать личную страницу на uid.me, рекомендуем воспользоваться автоматической регистрацией через социальную сеть. При клике по любой из кнопок “Войти через” — личная страница будет мгновенно создана без необходимости вводить регистрационную информацию!

uid.me — сервис личных страниц (технические детали inside)

Забегая вперёд, хотим сказать, что тесная интеграция с социальными сетями в ближайшем будущем существенно сместит план развития проекта.

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

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

Возможно, это будет выглядеть как-то так:

uid.me — сервис личных страниц (технические детали inside)

ЧАСТЬ 2. Техническая

Разрабатывая uid.me под крылом uCoz, мы оказались в довольно необычном положении: с одной стороны, весь код проекта предполагалось написать с чистого листа, с другой стороны, в день релиза проект автоматически становился высоконагруженным, так как должен был импортировать в себя более 20 млн профилей, даже с учётом того, что бот-регистрации и совсем уж древние профили не прошли конкурс.

Тем не менее, мы решили сделать всё красиво и с использованием модных технологий, проведя таким образом разведку боем, получив много опыта и потенциальный левелап в итоге.

В качестве слагаемых успеха были выбраны:

0. Nginx. Куда без него.

1. База данных, из коробки решающая вопрос распределения данных на несколько серверов + отказоустойчивость при физическом выпадении сервера из кластера по любой причине. В этом качестве, несмотря на активные холивары, была выбрана MongoDB.

2. Гибкая схема данных, позволяющая без потерь проходить первичную и последующие фазы прототипирования функционала. Опять же помог MongoDB, хотя здесь пришлось заплатить ресурсами за удобство, так что получить главный ответ на вопрос: “BSON — это роскошь, или современное средство передвижения?” — ещё предстоит.

Стоит заметить, что исходная mysql база данных пользовательских профилей при конвертации в MongoDB формат выросла в 5 раз. Однако, каждый профиль при этом обогатился внушительным количеством новых данных, связанных с функционалом uid.me, поэтому дело не только в прожорливости гибкой схемы данных BSON.

3. Честно говоря, учитывая современную тенденцию к активному применению динамических JS интерфейсов (а также безмерное уважение к технологическому прорыву, сделанному инженерами Google при разработке V8 Javascript, на порядок обходящему по производительности все существующие скриптовые языки за счёт динамической компиляции в машинный код), закралась шальная мысль применить node.js и замкнуть круг веб-разработки на JavaScript, получив вместе с тем несколько жирных плюшек…

Но решили, что “один проект — одна новая технология, и нам пока что MongoDB ВОТ ТАК хватает” (с) Александр Соловьев. Кстати, кто не видел этот его доклад — это хит, рекомендуем всем коллективом!

В итоге, в качестве серверной технологии решили оставить корпоративно-привычный Perl, однако нам удалось набрать вторую космическую скорость, покинуть гравитационное поле fast_cgi и применить Mojolicious — современный автономный и адекватный (не считая автора) веб-фреймворк с роутами, хелперами, бриджами, встроенной поддержкой асинхронных запросов и прочими положенными современному разработчику сладостями.

4. Тотальная асинхронность и кеширование данных при взаимодействии с социальными сетями.

К слову о прототипе проекта — было замечено, что данные из социальных сетей, полученные сервисом about.me, не обновляются, загружаясь лишь единожды — в момент подключения сервиса. Вероятно, опция обновления кеша доступна VIP пользователям, но нам не удалось добиться от about.me обновления информации. Это навело нас на мысли о том, что стоит по возможности как можно более качественно организовать межсерверное взаимодействие и систему кеширования, чтобы минимизировать риск возникновения схожих проблем в будущем.

Практически повсеместно внедрённый OAuth2 и схожесть в организации API различных социальных сетей дали возможность удачно обобщить взаимодействие.

Конечно, на этапе прототипа вся работа с API была синхронной, но блокировать Hypnotoad воркеры для осуществления API запросов в высоконагруженном проекте — однозначная роскошь и расточительство. К счастью, Mojolicious построен на весьма приличной, как по интерфейсу, так и по реализации, событийной машине, благодаря чему, кстати, каждый воркер в пуле способен параллельно обрабатывать не один (как в случае, скажем, с mod_perl), а десятки параллельных запросов, конечно, при условии, что те содержат значимое количество асинхронного кода.

К слову, учитывая то, что одним из основных “пугающих” аргументов против применения node.js является его тотальная асинхронность, — Mojolicious может послужить отличным ментальным мостом, когда вы начнёте разработку в рамках классической синхронной парадигмы, а закончите, как минимум, имея значительную часть гибридного кода (sync + async). Признаться, теперь мы боимся node.js значительно меньше и надеемся применить его в последующих проектах.

Вообще, uid.me делался по принципу “нет велосипедам”, и в жертву Шиве был торжественно принесён целый пласт ископаемых самоделок, возглавляемый широко известным в узких кругах килобайтным макросом “dw”, с 2005 года верой и правдой служивший нам и близким нам разработчикам и позволивший в трудный час избежать трансцендентного ужаса DBIx::Class. Светлая память.

И всё же, при разработке uid.me родилась одна занимательная поделка — это макрос

take { … $take->(‘named_callback_slot_1’) ... } process { my $taken = shift; … },

построенный на Mojo::IOLoop->delay и радикально упрощающий весь цикл операций, связанных с организацией именованных каскадных асинхронных API взаимодействий, включая каскадную обработку исключений (при возникновении интереса — пишите в личное, поделимся).

Возвращаясь к MongoDB

Применить на практике что-то похожее на NoSQL решение хотелось ещё с тех времён, когда это не было мейнстримом. В рамках тех highload задач, с которыми в то время приходилось сталкиваться, постепенно нарисовалось следующее понимание:

1. Классический LAMP проект стартует с классической SQL БД.
2. Если проект становится популярным, он обретает статус «highload», иначе goto 1.
3. Статус «highload» обязывает нас вплотную задуматься о кешировании, шардировании, репликации и
бекапе того, что хранится в SQL БД.
4. Эволюция схемы данных живого проекта становится тем более болезненной, чем больше данных накоплено, и тем более востребованной, чем более популярным оказался проект.
5. В результате всего этого ORM код начинает выполнять функции mutex, сериализации/десериализации данных для memcached, примитивного шардирования, в особо жестоких ситуациях — патчи обеспечения обратной совместимости схемы данных (ибо позволить себе большой сквозной апдейт данных в реальных условиях удавалось далеко не всегда).

Впрочем, довольно о грустном, на дворе были суровые 2000'е.

Начало 2010'х было озарено появлением нескольких NoSQL решений, которые обещали устранить бОльшую часть проблем растущего highload проекта «из коробки». Появление открытых, готовых к использованию NoSQL решений пророчили многие, но, тем не менее, фактическое обретение прекрасного будущего нас приятно удивило.

Посоветовавшись с более экстремальными в плане новшеств коллегами, мы решили пробовать MongoDB.

Изучая новую для себя технологию, мы посчитали логичным применить её возможности по максимуму, надеясь на лучшее (а значит, на серебряную пулю из коробки), рассчитывая, впрочем, откатиться к более классическим техникам в тех местах, где чрезмерная наглость столкнула бы нас с интересными подводными камнями.

Под применением возможностей по максимуму мы подразумеваем следующее:

1. JSON формат хранения данных позволил не возиться с привычными parent/child/x-связями в схеме данных по поводу и без, ограничившись здравым смыслом. В результате вложенная структура основного объекта user оказалось жирной, но удобной. В неё смело вложили кучу флажков, настроек отображения, мелких связанных списков и всего того прочего, что раньше с ходу приводило к созданию пачки около-user'овых SQL таблиц.

2. В модель данных добавили код общего назначения, который на этапе прототипирования интерфейса позволил крайне приятно наращивать JS функционал: по URL /profile/save стало возможным послать любой JSON, который extend'ил объект пользователя новыми данными, например:

user.save({
    'style.profile.top': '20px',
    'style.caption.tags.color': 'rgba(30, 29, 38, 1)',
    'info.first_name': 'Павел'
});

Все операции, связанные с деятельностью авторизованного пользователя были упакованы в общую функцию отправки с латентным коллектором в 500 мсек, объединяющим различные атомарные правки в общие пакеты.

В результате, client-side разработчики смогли легко расширять структуру объекта user, просто начиная использовать новые поля.

Конечно, после фазы прототипирования, серверная часть /profile/save была снабжена контекстными фильтрами данных, которые отсекали неизвестные поля и фильтровали значения на предмет корректности.

Осталась только одна проблема — в БД могли храниться пользователи, у которых вообще не существовали некоторые поля, так как последний раз они редактировали свой профиль ещё до того, как эти поля возникли. В идеале, хотелось бы иметь default-значения для каждого поля, которые будут магическим образом появляться в любом объекте, извлекаемом из БД.

На уровне ORM добавили forced extend всех извлекаемых данных default значениями для всех несуществующих полей.

Круг замкнулся.

Мы получили возможность динамически расширять структуру объекта, не прибегая к сквозным апдейтам БД, прозрачно работать с ней не только со стороны сервера, но и на client-side, при этом процесс добавления нового оказался довольно приятным, а переход от прототипа к релизу сопровождался ровно двумя действиями:

1. Добавлением правила для данных нового поля в фильтры extend_rules.
2. Добавлением ожидаемого значения по умолчанию для этого поля в default_user.

Вот, пожалуй, и всё. Спасибо за внимание, ждём вас в гости!

P.S. на сладкое, любителям обнажёнки:

дамп профиля из mongodb

Using username "www".
MongoDB shell version: 2.4.2
connecting to: uidme
mongos> db.user.find({'uid':'pavel_kudinov'}).pretty();
{
	"_id"   : ObjectId("519bbb1592762f6d65424301"),
	"uid"   : "pavel_kudinov",
	"email" : "kudinov.pavel@gmail.com",
	"uguid" : "2926366677"
	"info"  : {
		"first_name" : "Павел",
		"last_name" : "Кудинов",
		"headline" : "живой"
		"bio" : "в начале был вечер,nпотом настал я",
		"gender" : "male",
		"birthday" : "1985-07-03",
		"tags" : {
			"places" : [ "Ростов-на-Дону" ],
			"jobs" : [ "uCoz.ru" ],
			"education" : [ "Бодхисаттва" ],
			"tags" : [ ]
		},
		"contacts" : {
			"email" : "kudinov.pavel@gmail.com",
			"icq" : "",
			"skype" : "pavel-kudinov",
			"gtalk" : "kudinov.pavel",
			"aim" : "",
			"phone" : "+7 (928) 167 12 03"
		},
		"sites" : [
			{
				"link" : "http://vk.com/kudinovpavel",
				"title" : "vk.com/kudinovpavel"
			}
		],
		"bg_pattern" : "",
		"background" : {
			"medium" : "/img/background/s/r/v/medium_r5vhibyl.jpg",
			"full" : "/img/background/s/r/v/full_r5vhibyl.jpg",
			"thumb" : "/img/background/s/r/v/thumb_r5vhibyl.jpg"
		},
		"avatar" : {
			"full" : "/img/avatar/full_etpcnfon.jpg",
			"thumb" : "/img/avatar/thumb_etpcnfon.jpg"
		},
	},
	"tech" : {
		"last_login" : 1385995749,
		"theme_id" : 4,
		"last_login_ip" : "178.76.238.102",
		"ucoz" : {
			"reg_time" : "1358928666",
			"last_login" : "1367856843",
			"langp" : "ru",
			"reg_ip" : "2991386214",
			"last_admlogin" : "1366901917",
			"avatar" : {
				"geom" : "-10:0:0.1524",
				"file" : "/img/ucoz/29/26/2926366677/.OWyAuYrnAliL.jpg",
				"type" : "photo"
			},
			"location_id" : "177270886"
		},
		"email_activated" : 1
	},
	"style" : {
		"profile" : {
			"width" : "431",
			"left" : "50%",
			"margin_left" : "-540px",
			"hidden_contacts" : [ "phone", "icq", "email", "gtalk", "aim" ],
			"shadow" : "false",
			"hidden_tags" : [ ],
			"text_shadow" : "black_shadow",
			"height" : "auto",
			"right" : "auto",
			"min_height" : "566",
			"indent-bottom" : "0",
			"hidden_apps" : [ ],
			"top" : "77px",
			"bgcolor" : "rgba(224, 224, 224, 0.5)"
		},
		"show_birthday" : "hide",
		"show_contacts" : "true",
		"editdialog" : {
			"left" : 499,
			"top" : 82,
			"open_tab" : "apps"
		},
		"avatar" : {
			"width" : "208",
			"height" : "210"
		},
		"apporder" : [ "facebook", "instagram", "google", "yandex", "youtube", "vkontakte", "twitter" ],
		"show_tags" : "true",
		"caption" : {
			"sites" : { "color" : "rgba(49, 49, 51, 1)", "font" : "Arial", "size" : "14" },
			"name" :  { "color" : "rgba(6, 44, 79, 1)", "font" : "Ubuntu", "size" : "55" },
			"bio" : { "color" : "rgba(6, 44, 79, 1)", "font" : "PT Sans", "size" : "15" },
			"tags" : { "color" : "rgba(30, 29, 38, 1)", "font" : "Arial", "size" : "14" },
			"headline" : { "color" : "rgba(6, 44, 79, 1)", "font" : "PT Sans", "size" : "20" }
		},
		"apptheme" : "t4",
		"bg" : {
			"left" : "0px",
			"right" : "auto",
			"margin_left" : "0px",
			"top" : "0px",
			"bgcolor" : "rgba(0, 0, 0, 1)",
			"key" : "fill",
			"pattern_opacity" : "0.9"
		}
	},
}
mongos>

Автор: pavel_kudinov

Источник


* - обязательные к заполнению поля


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js