SPA, на примере Youtube

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

1) обижаешь. это же UB! 2.1) подожди другие ответы. 2.2) видимо, ютубовцы чистят плохо.

addon - youtube classic, h264ify

Костыль костыля костылем погоняет.

Но, за наводку спасибо.

А у тебя это прям регулярно наигрывается? Минут за пять сосредоточенного тыканья я осилил наиграть это один раз.

А, я понял что это. Это просто добавляет в урл параметр: «disable_polymer=1». Не спасает.

Да, регулярно — сетка через проводной тлф.

Подтвердите баг в SPA ютуба.

Не подтверждаю. Google Chrome 70.0.3538.110
В пресетах сети выставил 3G.
Баг не воспроизводится. Все функционирует нормально.

https://support.google.com/youtube/answer/4347644

А ты не кликай резко! Ишь раскликался. Конечно лепить эту дрисню на ненадежных медленных каналах, великолепная идея. Обожаю веб!

Давно наблюдаю такое.

Может людям с разогнанными i7 и 32гб оперативной памяти это и не заметно. На моей буханке или ждать пока страница прогрузится, паузить видео и потом переходить по ссылкам или потом рефрешить.

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

Баг подтверждаю. К сожалению, так и не понял, как убрать автовоспроизведение, не имея учётки

На телевизоре, тоже бывает подобная фигня с ютубом.

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

Бывает так и не может прогрузить весь интрефейс вообще. А бывает не может прогрузить комменты.

Только аддонами.

Если не секрет, какими? Раньше работал YouTube HD, но из-за него у меня был другой баг: видео тут же ставилось на паузу, даже после запуска воспроизведения руками на 100500-й раз

не монкеи чистят состояние прошлой вьюшки при переходе в следующую

Хочу добавить. Вот зачем все эти лишние абсракции? Браузер и так чистит состояние «вьюхи» (предыдущей страницы) при переходе на следующую. Т.е. придумали прослойку поверх того, что не может работать иначе как запрос-ответ (вебсокеты по сути туда же) и поимели двойные проблемы — лишний жор ресурсов клиента и ручная уборка за собой. Найс!

Мне не нравится интерфейс YouTube, поэтому пользуюсь youtube-dl + mpv или SMTube. SPA — сложный stateful интерфейс. В WWW намного проще работать с stateless, они надежнее и предсказуемее.

1) Не смог воспроизвести.

2.1) Таких проблем нет и не будет если все написано нормально, в гугле и ютубе говнокодеры, там уже давно не делают хороший код.

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

Таких проблем нет и не будет если все написано нормально

Можно примеры кода для реакта и вуя?

reactjs - https://reactjs.org/docs/react-component.html#unmounting
vue.js - https://vuejs.org/v2/api/index.html#beforeDestroy

https://hooktube.com (Осторожно, на глагне очень часто всплывает NSFW)

Яцна. Всё вручную. Врядли этим пользуются хотябы 50% пейсателей. Ну, после прочтения этого треда, задумавшихся об этом, надеюсь, станет больше.

Работает оно из рук вон плохо

Это касается не только ютуба, но и многих других сервисов в виде SPA, над которыми, по-идее, трудятся толпы народа, и должны вылизывать всё до блеска... но нет. Буквально на днях, пока меня не забанили, на хабре видел такую хрень, где у меня вместо различных значений вылезали текстовые строки типа обращения к значениям каких-то структур (дословно не помню, но типа должно быть: «карма: 5», а мне пишет: «карма: user_data.karma.count»). Потом вроде это пропало, но стало в других местах вылазить, вроде после нажания кнопок. А ещё есть беды даже не на SPA, просто на аджаксе. На ЛОРе, например, я так понял, ещё не починили: тыкаешь кнопку «отправить», вылезает плашка «Был добавлен новый комментарий. Обновить.», а потом оказывается, что этот новый комментарий - это то, что ты только что отправил нажатием на кнопку «отправить».

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

Всё дело в

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

2. Асинхронности. Где калбэк на калбэке калбэком погоняет, плюс это всё завёрнуто в сопрограммы, прописы и всякие await/async, которые в свою очередь завёрнуты в кишки фреймворка. И даже вооружившись дебаггером, можно себе мозг сломать, желая просто отследить путешествие одного запроса через все эти дебри.

Ваш вопрос слишком абстрактен. Уточните.

Судя по описанию бага, на ютубе остаеться нода с видосиком в доме. Скорее всего проблема в коде роутера/виртуал дома, а не в коде пользователя (пейсателя).

1. Внезапно вроде ютуб пишут на тайпскрипте (могу ошибаться).

2. А без неё никак, собственно эти фреймворки и призваны с ней бороться за счет реактивности.

остаеться нода с видосиком в доме

Конечно.

Скорее всего проблема в

А я про обоих пейсателей. И ядра и логики.

Скорее всего проблема в коде роутера/виртуал дома

Да, вот ещё одна проблема. Я что-то про неё забыл. Забагованность самих фреймворков. Когда ты пишешь, вроде как всё верно, но все равно всё работает через одно место. Мне как-то доводилось писать на AngularJS (это который первой версии) и я учитался до усрачки документации, чтобы сделать всё нормально, но память в определённый момент утекала по мегабайту раз в несколько секунд. Тогда я полёз в сеть и обнаружил воркэраунды, которые почему-то ничерта не работали. А исправлять баги никто не хотел, потому что вышел уже Angular 2,3,5,6,etc. - и ваш первый уже никому не интересен. Решилось это всё отловом каких-то событий (уже не помню нюансов) в недрах реакта и ручной чисткой DOMа. Но убит был не один человекодень, подключались люди из параллельных проектов, все плевались и уходили. А перейти на ангуляр 2 низя - несовместимость, мать их.

реакта

*ангуляра

(простите, запутался)

перейти на ангуляр 2

Хрен редьки был не слаще, слышал я.

Хрен редьки был не слаще, слышал я.

Я тоже слышал. Но на проектах не пробовал, только палочкой тыкал. Там же ещё вышла куча версий. И я вообще не в теме, зачем, и как это между собой совместимо. Говорят, сейчас Vue - больше труъ. Но, как по мне, та же ересь только в профиль.

Давным давно, в одной галактике... пользовали шаблоны ака конкатенация строк завернутых в функцию (ограничение скопа) с трай кеч на случай порушенного синтаксиса, где аргументами передавалось все что нужно для отображения, а компонент, умеющий работать с содержимым этого шаблона, обслуживал и интерактив в нём. Так это работало и в ИЕ6 без проблем и быстро.

Всё новое - хорошо забытое старое, только сложно, медленно и с ошибками, а иногда и за деньги.

+100500 the right way.

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

Никто не мешает и сейчас так писать, особенно если нужно что-то попроще макаронного монстра фейсбука. Может они еще к этому вернуться на каком-то витке «развития».

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

Ну так из любой конфетки можно сделать говно, дело то не хитрое :) А тут и конфетки не было, делали из с того что было)

Короче, залез на ютуб в очередной раз. Поставил этот рекомендованый аддон — а он, скотина такая, почему-то блочит редирект с локейшн заголовками, т.е. приходится рукой докликивать. Снёс это гавно.

Запилил свой трёхстрочник юзерскрипт:

// SPDX-License-Identifier: MIT-0

// ==UserScript==
// @name     Disable polymer on Youtube
// @grant    none
// @include  https://www.youtube.com/*
// @run-at   document-start
// ==/UserScript==

(function() {
    if (!document.location.search.match('disable_polymer')) {
        document.location.search
            += ( (!document.location.search ? '?' : '&') + 'disable_polymer=1');
    }
})();

Кстати, в первом ангуляре угорал с canvas: я грузил картинку, чтобы подготовить канвас Большого размера, нужно знать ширину родителя канваса. Ширину которого я узнаю после рендеринга. Который происходит сильно после сборки директивы angular, так что нормально сделать канвас в директиве не возможно! Только с костылями сбоку.