Программирование


Ответить в тред Ответить в тред

Check this out!
<<
Назад | Вниз | Каталог | Обновить тред | Автообновление
24 4 18

[Тред №2] React оболочка двача 10/06/19 Пнд 15:12:43 14145081
icon@1280x1280.png (48Кб, 1280x1280)
1280x1280
Предыдущий тред того.
Брал паузу, отдыхал.
Лето, туда-сюда.

А тем временем я реализовал тот самый "стриминг" сообщений, про который писал ранее.
https://github.com/catamphetamine/virtual-scroller
Непростая задача была.
Выкачен на сайте: https://catamphetamine.github.io/chanchan/
Если открыть DevTools, то можно увидеть, что рендерится "обманка": только несколько сообщений из всего списка ~500 сообщений, которые попадают в экран, а остальное — padding-top и padding-bottom.
При скроллинге это всё подменяется в режиме "кручу-верчу, следите за руками".
Как результат, рендеринг всего списка сообщений теперь не занимает секунду или более на современных настольных CPU.

Вторым фактором был парсинг сообщений — оказалось, что это тоже долго.
Использовав встроенный в Хром "профайлер" увидел узкие места и кое-где кое-чего оптимизировал, плюс со стримингом теперь парсятся не все 500 сообщений сразу, а только те, которые видны.
Итог: аниме-тред на 2500 сообщений теперь не виснет на 5-10 секунд, а парсится за 50 миллисекунд и рендерится так же быстро.

Ещё одна сложность была в том, чтобы правильно обновлять высоту элементов списка: всё достаточно просто, когда элементы списка не растут по высоте, но в данном случае можно нажать "Показать ответы", после чего высоты переизмерятся.
К тому же, React не сохраняет компонент, когда он уже не виден, поэтому возникла ещё одна задача: сохранять state где-то, и потом, когда сообщение снова видно — восстанавливать этот state: всё древо раскрытых комментариев, и состояния для каждого из сообщений этого древа ("Показать текст полностью").
В общем, рекурсия на рекурсии, но я смог.

За кадром, конечно, было ещё много чего прочего.

А ещё я понял, что "хуки" всё-таки норм, и новые проекты можно писать на них.
Пока ещё устоятся немного, народ потестирует.
Плюсы: минификация кода, т.к. методы и переменные классов не минифицируются.

Сроки релиза пока можно сдвинуть на "ближе к осени", судя по всему.
Аноним 10/06/19 Пнд 19:54:20 14146002
Аза аза
Аноним 10/06/19 Пнд 20:56:44 14146323
>>1414508 (OP)
> Если открыть DevTools, то можно увидеть, что рендерится "обманка": только несколько сообщений из всего списка ~500 сообщений, которые попадают в экран, а остальное — padding-top и padding-bottom.
Ты освоил виртуализованные списки?) Ох вау, со импрессинг, со смус, со мач перфоминг.
Аноним 11/06/19 Втр 00:00:38 14146994
>>1414632
у вас unclosed parenthesis, перекомпильте
Аноним 11/06/19 Втр 09:41:57 14147705
>>1414699
> unclosed parenthesis
Это переменная в utf-16, ты нихуя не шаришь прост.
Аноним 11/06/19 Втр 22:03:40 14149636
ОП, ты сколько часов в день работаешь, откуда столько времени на велосипеды?
19/06/19 Срд 20:43:08 14189917
>>1414699
> Ты освоил виртуализованные списки?
На самом деле, просто зачем-то полез смотреть, как работает новый Твиттер, и осенило. А так, пытался в своё время устроиться iOS-разработчиком (чё-т не взяли, хз, прост))), там эту виртуализацию использовали по "дефолту" все таблицы, потому что процессоры тогда ещё были не такими накачанными.

> у вас unclosed parenthesis, перекомпильте
Хз, вроде ничё не пишет.

> ОП, ты сколько часов в день работаешь, откуда столько времени на велосипеды?
Самое смешное, что я сначала написал свою первую оупен-сорс библиотеку, потом уволился, а потом уже нашёл работу, потому что библиотека набрала звёздочек.
Так что путь не "сначала будет время, потом займусь", а "сначала займусь, а потом посмотрим".
Это как я думал: вот, не буду ходить на работу, будет много свободного времени, напишу свой стартап. На деле понятно, что это всё просто отговорки.
А так, если работать за доллары, то можно на неполный рабочий день, плюс если знаешь, что куда, то можно работать пару часов, а писать "четыре".
Но "там" своих Вась хватает, там работают только с теми, кто умеет работать, а это не всем дано (профессор Савельев подтвердит).
19/06/19 Срд 20:51:11 14190008
Сегодня ещё некий ловкий китаец по имени "Long Ho" (ладно ещё не "Long Hui") задвинул меня в конец списка библиотек, радостно воткнув свою на первое место.
Вот, бодаемся: https://github.com/tc39/proposal-intl-relative-time/pull/112
На самом деле, май-июнь эти выдались занятые, и у меня завал по багам (забил на них), да и двачи стоят, вот вроде начали шевелиться немного (работу сдал позавчера).
Ещё летом надо гулять, чтобы не было потом мучительно за ещё одно лето перед комплюктером.
19/06/19 Срд 20:54:28 14190039
01/07/19 Пнд 08:11:18 142528510
Вести с полей:

Приложение переименовано в "captchan".
Завезли темы, в том числе кастомные: https://github.com/catamphetamine/captchan/blob/master/docs/themes/guide.md
`kohlchan.net` с июня перешёл с движка `vichan` на движок `lynxchan` — добавил этот движок в приложение: https://catamphetamine.github.io/captchan/t/1177?chan=kohlchan Бодаемся с автором движка в данном треде: http://lynxhub.com/lynxchan/res/722.html#q984
Добавил всякого по мелочи: экспорт/импорт настроек.

Павел Дуров объявил, что скоро будет второй конкурс, так что нужно отдохнуть перед ним.
03/07/19 Срд 09:48:23 142688611
eva-dark-3605x1[...].png (767Кб, 3605x1929)
3605x1929
eva-light-3605x[...].png (772Кб, 3605x1929)
3605x1929
default-dark-36[...].png (760Кб, 3605x1929)
3605x1929
default-light-3[...].png (766Кб, 3605x1929)
3605x1929
Добавил "Ночной режим".
Аноним 03/07/19 Срд 17:15:17 142712112
>>1414508 (OP)
Норм. Сделай так чтобы развернутые картинки открывались в галерее, в которой можно будет переключаться с помощью стрелок и фильтровать по типу файла (картинка, гиф, видео).
Аноним 03/07/19 Срд 23:43:46 142749113
Ох, ну наконец-то пидорасов-хреньворкщиков изгнали из JS-треда.
Аноним 06/07/19 Суб 09:09:21 142884414
>>1414508 (OP)
неплохой проект
работаешь, фрилансишь?
Аноним 12/07/19 Птн 14:06:55 143320515
>>1426886
Бля неплохо мне нравится хороший проект
Аноним 14/07/19 Вск 02:23:20 143454916
>>1414508 (OP)
Объясните, кому не трудно, щито это такое? Типо дашчана? Капчевать можно будет?
Аноним 14/07/19 Вск 04:26:26 143455917
>>1414508 (OP)
Идея хорошая. Вот бы еще реализацию цепочки ссылок на реплаи к другим постам.
14/07/19 Вск 06:57:46 143457318
>>1427121
> Сделай так чтобы развернутые картинки открывались в галерее, в которой можно будет переключаться с помощью стрелок и фильтровать по типу файла (картинка, гиф, видео).

Выкатил бета-версию такой кнопки наверху страницы треда.
(Если речь была об этом)
Когда-нибудь в будущем доработаю на автоплей роликов при листании в таком слайдшоу.

Выкатил также бета-версию кнопки "Развернуть картинки".
Там тоже будут доработки в будущем: не увеличивать картинки свыше их максимальной ширины, а также уменьшать картинки, высота которых выше высоты экрана ("постеры").

> Ох, ну наконец-то пидорасов-хреньворкщиков изгнали из JS-треда.

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

> Бля неплохо мне нравится хороший проект

Рыбак рыбака видит издалека.
Я видел вашу звезду на житхабе, и ваш репозиторий имиджборда на болгарском.
Забавный факт: я раньше писал код на русском.
Потом передумал.
(Была у меня в 2012-ом своя маленькая very own соцсеть, и нарёк я её Социопатией, и сидели там друзья мои три дня и три ночи, после чего проект был свёрнут)
https://github.com/catamphetamine/sociopathy/tree/master/static%20resources
https://github.com/catamphetamine/sociopathy/blob/master/code/web/core/user.coffee


> Объясните, кому не трудно, щито это такое? Типо дашчана? Капчевать можно будет?

Это новая-модная сычевальня-капчевальня, которая прикручивается к любому %channame%
Только современные браузеры, только яваскрипт.
Где-нибудь к концу года будет юзабельной.
Попробую пропихнуть её во все чаны.
В любом случае это интересный опыт, много чего узнал нового.

> Идея хорошая. Вот бы еще реализацию цепочки ссылок на реплаи к другим постам.

Давайте подробнее.
Где конкретно что конкретно как конкретно.
А не вот эти ваши вот "я что-то нажала и всё исчезло".
14/07/19 Вск 07:10:08 143457419
Тут ещё на работе постановили, что весь новый код будет писаться на "хуках", и скажу я вам: изначально я был скептичен по отношению к "хукам", но сейчас уже понял, что это удобная вещь — во-первых, минификация кода возможна в более широких масштабах; во-вторых, разделение функционала на части удобнее.
Например, есть компонент Таблица, который имеет кучу разных "фич".
По классике (как писали раньше в вакансиях, "знание основных шаблонов программирования") это делается "декораторами", то есть обёртыванием Таблицы в ТаблицуССортировкой, а её — в ТаблицуСЭкспортомВЭксель, а её — в ТаблицуСЧекбоксами, и так далее: в итоге получается такая "капуста".
С "хуками" цепочка декораторов уплощается, и получаются своего рода "микс-ины", которые раньше были в Реакте, но были убраны.
В общем, "хуки" в Реакте создают свой немного особый язык программирования (мета-язык), который уже не совсем яваскрипт, потому что Реакт здесь выступает как своего рода Виртуальная Машина, предоставляющая свой "рантайм", на котором работают эти "магические" "трюки".
Прикольно получается, более функционально.
Такая "хипстерская" штука.
В общем, пишите на "хукахъ".
14/07/19 Вск 07:12:03 143457620
image.png (70Кб, 2870x413)
2870x413
(кнопки справа)
14/07/19 Вск 07:14:40 143457921
image.png (727Кб, 3641x1953)
3641x1953
image.png (504Кб, 3054x1941)
3054x1941
image.png (501Кб, 3080x1941)
3080x1941
Ещё удобная вещь — sentry.io.
Если не полениться и установить его на сайт (что делается минут за 15), то можно отлавливать все ошибки с "стектрейсами".
Кто, с чего, откуда, где, на какой строке, что делал до этого.
И бесплатно.
Аноним 14/07/19 Вск 11:06:05 143466622
>>1434579
Нужно написать конкурента на Scala и продавать за даллары!
Аноним 14/07/19 Вск 13:12:35 143474123
>>1434579
>то можно отлавливать все ошибки с "стектрейсами".
Что это за ошибки с "стектрейсами"? И зачем для их отлова нужен отдельный вот такой инструмент?
Аноним 14/07/19 Вск 13:34:47 143477024
>>1434741
Эта хуйня для сбора статистики. В рантайме у кого-то ещё бывают ошибки? ТС плюс валидаторы разве не закрывают львиную долю подобных рантайм ошибок?
Крч, сентри для слабаков.
Аноним 14/07/19 Вск 16:09:07 143497525
ОП, ты объясни откуда у тебя столько времени, ты на полставки работаешь? Сколько часов в неделю уделяешь пет-проектам?
Настройки X
Ответить в тред X
15000 [S]
Макс объем: 40Mб, макс кол-во файлов: 4
Кликни/брось файл/ctrl-v
Стикеры X
Избранное / Топ тредов