новый движок

"Ленивая" загрузка картинок + остановка гифок на плохом интернете

Этот пост касается только нового движка, на текущем основном реакторе все без изменений.

Что такое "ленивая" загрузка?

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

Это полезно и с точки зрения экономии трафика, и с точки зрения более приоритетной загрузки именно тех картинок, у которых максимальный шанс быть посмотренными.

Раньше мы полагались на библиотеку nextjs в вопросе "ленивой" загрузки картинок, но в новой версии они - согласно современным практикам - отказались от своих механизмов и перешли на встроенные механизмы "ленивой" загрузки в браузерах. Стало лучше!

Для примера рассмотрим, как работает "ленивая" загрузка картинок в Хроме (и в браузерах на Chromium). С июля 2020 года разработчики браузера изменили расстояние от видимого экрана, на котором картинки начинают загружаться. Для быстрого интернета это расстояние уменьшили с 3000 пикселей до 1250 пикселей, для медленного - с 4000 пикселей до 2500.

Разработчики браузера говорят, что могут еще экспериментировать с этими порогами. Мы на этот встроенный механизм влиять не можем.

Сурс: https://web.dev/browser-level-image-lazy-loading/

В разных браузерах могут быть разные расстояния от видимой части экрана.

А что же гифки?

Гифки и гифковидео(видеогифки?) тоже подвластны этому механизму браузера. В дополнение мы в качестве эксперимента добавляем новый механизм остановки гифковидео для плохого интернета.

Если браузер решил начать загрузку видеогифки, но за 5 секунд загрузка не закончилась полностью, мы ставим видео на паузу и показываем контролы. Это выглядит вот так:

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

Пользователь может сам решить, интересна ли ему гифка, будет ли он ждать ее полной загрузки. Если гифка будет безжалостно промотана, браузер сильно понизит приоритет или вовсе остановит загрузку данных для этой видеогифки.

Обратная связь

Для нас новый движок - это тестовая песочница для новых фичей, построенная на довольно новых технологиях. Через 5 лет эти технологии перестанут быть столь новыми, и все будет работать на каждом утюге и чайнике. А пока могут быть проблемы, о которых вы можете нам сообщить, что поможет нам обкатать новый движок как следует.

Важно! Мы принимаем репорт только если у вас отключены все расширения браузера или вы используете "чистый" браузер. Если проблема возникает только с включенным расширением, то репорт надо слать разработчику расширения, а не нам.

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

А вот инструкция как прислать репорт о баге на новом движке нам: https://m.joyreactor.cc/report

До связи, драгоценные!

Этот тег касается вопросов разработки нового движка реактора.

https://m.joyreactor.cc/ - полное зеркало

https://safereactor.cc/ - только sfw-контент.

Как сообщить об баге или поведать нам о своем опыте/пожеланиях? 

Можно написать пост с этим тегом или отправить нам багрепорт на почту. Вот инструкция: https://m.joyreactor.cc/report

Внимание! Если вы хотите прислать нам сообщение об ошибке, убедитесь, что все расширения в браузере отключены или вы работаете в "чистом" браузере.

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

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

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

проверял на qualcomm snapdragon 732g, на котором все сайты работают отлично (даже новый редизайн ПДФ), кроме джоя

Кажется тут баг

Писал пост как обычно, но на новом движке и не получилось 

Ммм... Новый движок!

Драг-н-дроп не работает. Запятая в тегах не работает.

Когда теперь наконец-то можно отбивать теги по Enter и просто вставлять картинку копипастом

Когда теперь наконец-то можно просто вставить картинку в редактор и отбивать теги по Enter

https://news.bigmir.net/i/48/18/59/2/4818592/85cb46d8615dc071a5ed124cafac612b-quality_75Xresize_crop_1Xallow_enlarge_0Xw_740Xh_400.jpg

Тестируем новую форму создания поста

Вы должны знать, что в наших горнилах куется новая версия движка реактора. Цель преобразований - исправить старые проблемы и добавить новые столь желанные фичи. Код текущего основного движка базируется на symfony 1.4, который уже около 10 лет считается legacy, и над ним работать просто нет смысла. Новые фичи - в новом движке.

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

Но сначала разберемся, зачем вообще на эту форму в перспективе переезжать.

Что умеет новая волшебная форма?

1) Форма принимает картиночки в формате webp.

2) В форму можно вставлять картиночки напрямую - вставкой из буфера обмена или драг-н-дропом файла.

3) Эта форма умеет делать спойлеры, также доступные на текущей основной версии движка.

4) Эта форма скажет вам заранее, какие теги поставить не получится.

Две основных причины почему тег пожет не поставиться: дубликат уже есть в списке (например, вы добавили тег "гифка" - "гифки", один из них лишний) или бан в теге.

То есть по форме можно узнать, есть у вас бан в теге или нет ;-)

Что эта форма пока не умеет:

1) Таблицы

2) Наглядная вставка видео/разрешенных эмбедов, но можно вставить видео ссылкой, как на старом движке.

3) Опросы

4) Какая-то фича, нужная именно вам? Пишите в комменты.

Еще идея спрятать заголовок поста прямо в эту форму, вот так. Что думаете?

В общем, пожелания и баги в студию!