• Как имитировать медленное соединение, Mac OS localhost?

    GeorgeTudosi
    @GeorgeTudosi Автор вопроса
    Технический директор, кинематографист, яхтсмен
    Всё оказалось довольно просто, хотя и не очевидно. Раз уж используем nginx, можно применить его магию, верно? Заодно не придется каждый раз отключать замедлитель для внешних ресурсов.

    Фрагмент nginx.conf:

    http {
        server {
            listen 8080;
            limit_rate 1M;
        }
    }
    stream {
        server {
            listen 80;
            proxy_upload_rate 1M;
            proxy_pass 127.0.0.1:8080;
        }
    }


    Показаны только строки, имеющие отношение к заданному вопросу. Остальное настраивается как обычно.

    Основной сервер унесен на порт 8080, и там происходит вся обработка запросов. limit_rate 1M; — это ограничение скорости отдачи ответа клиенту, и оно срабатывает в любом случае.

    Подключаемся к разрабатываемому приложению через порт 80 (если вам нужно https, то 80 заменить на 443), то есть в браузере порт не указываем — для клиента всё выглядит в точности как обычно. А nginx отправляет запрос на порт 8080 с ограничением скорости proxy_upload_rate 1M;. Можно, разумеется, использовать и другой подходящий свободный порт.

    Если надо ограничивать скорость только в особых случаях, а обычно удобнее иметь неограниченную скорость, можно слушать в блоке stream любой свободный порт, а в блоке http продублировать server с теми же параметрами, но без limit_rate и с «обычным» портом.

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

    Способ применим не только для MacOS, будет работать в любой системе, если вы используете nginx.
    Ответ написан
    Комментировать
  • Насколько корректно отдавать логотип заказчику дробленными фигурами?

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

    Лучшее, что вы можете сделать — отрисовать логотип по-правильному (благо его устройство предельно простое) и отдать нормальный вектор заказчику, он (возможно) будет вам благодарен.
    Ответ написан
    Комментировать
  • Как можно избежать сдвига контента при открытии модального окна?

    GeorgeTudosi
    @GeorgeTudosi
    Технический директор, кинематографист, яхтсмен
    JS для этого не нужен. Одна строка в CSS:

    .pop-up { overscroll-behavior: contain; }
    Ответ написан
    Комментировать
  • Как сделать прозрачный фон в видео?

    GeorgeTudosi
    @GeorgeTudosi
    Технический директор, кинематографист, яхтсмен
    Снимайте на однотонном и равномерно освещенном зеленом фоне (если одежда зеленая, то на синем, но результат при прочих равных будет похуже). Дальше Keylight в Ае. Так вы получите видео с прозрачным фоном, которое можно использовать в проекте Ае или экспортировать с альфа-каналом (не все контейнеры и кодеки это поддерживают).

    Сложности начнутся, когда вы захотите вставить такое видео на сайт. В голову приходит только контейнер Webm + кодек VP9, такая связка поддерживает альфа-канал. Изучите совместимость с браузерами, и если она вас устроит, это будет, вероятно, лучшим решением.

    Вот очень подробная, но устаревшая статья: https://css-tricks.com/overlaying-video-with-trans...

    Вероятно, с тех пор поддержка браузерами улучшилась, так что проверьте все утверждения автора. Общие же мысли там остались верными и сейчас.
    Ответ написан
    3 комментария
  • Как сделать развертывание аккордеона плавным?

    GeorgeTudosi
    @GeorgeTudosi
    Технический директор, кинематографист, яхтсмен
    Я бы рекомендовал вовсе не использовать аккордеоны — это ад с точки зрения пользователя. Лучшее решение — длинный документ с прокруткой и оглавление со ссылками на разделы. На широких экранах оглавление удобно размещать сбоку, на узких (например, на мобильных) решать как-то иначе — например, с гамбургером. Не слишком элегантная конструкция, но лучше исходной.

    Если же аккордеон почему-то необходим, возьмите старый добрый jQuery и slideUp(), slideDown(), slideToggle() в зависимости от требуемого поведения. Можно и вручную написать, но с библиотекой проще и совместимость лучше.
    Ответ написан
    2 комментария