Следите за зависимостями. Уже писал об этом ранее, но хочу рассказать про другой кейс, что ещё интересного можно увидеть в сборке (не «удалите moment.js», о чём пишут в 99 % статей на тему анализа зависимостей). В этот раз воспользуемся инструментом source-map-explorer.
Возьмём обычную таблицу, где есть числа.
Такие числа неудобно сравнивать из-за выравнивания по левому краю, разрядность плохо считывается. Что ж, выровняем этот столбец по правому краю.
Ключевые слова: angular, secondary entry-points, component library.
В прошлой заметке мы разбивали одну библиотеку на несколько, дабы пользователи не тянули крупные куски функциональности, которые им не нужны. Но что, если библиотека продолжает расти? Можно продолжать разбивать на небольшие библиотеки, но управляться с ними в ручном режиме уже будет неудобно (версионирование, публикация). Есть и другое решение — второстепенные точки входа.
Исходные данные: разрабатываем библиотеку компонентов на Ангуляре. Поехали!
При помощи Ангуляра могут создаваться проекты двух типов: приложения и библиотеки. Как указано выше, нас интересует разработка именно библиотеки. Но в процессе разработки эту библиотеку необходимо где-то тестировать. Соответственно, нам нужно тестовое приложение. Неудобно создавать для этого отдельное рабочее пространство, поэтому положим их рядом, в папку projects, структура (упрощённо) получается следующая:
projects
├╴app
└╴lib
package.json
angular.json
tsconfig.jsonОднажды обратил внимание, что у коллег размер проекта (the initial size of the app) перевалил за 10 Мб. Пятничным вечером, когда было скучно, решил посмотреть, в чём там дело, можно ли сделать что-то ощутимое небольшими усилиями.
В проекте практически нет медиафайлов, поэтому сразу смотрим на скрипты и видим монстра под названием vendor.js, который весит 9550 Кб, всё остальное значительно меньше. Для анализа содержимого воспользуемся инструментом webpack-bundle-analyzer.
В программировании условия («операторы ветвления») являются базовой конструкцией, но зачастую можно не писать в лоб if, а использовать более подходящие варианты, выразительные и лаконичные.
После публикации предыдущей записи внимательные читатели подсказали, что видят в Твиттере другой интерфейс. Выяснилось, что если просто оказаться на сайте, то мы увидим ту старую версию, на основании которой я писал предыдущую заметку. Но если залогиниться в системе, то перед нами уже предстаёт новый интерфейс.
Что ж, давайте его проверим. Как обстоят дела с дёрганием подсказки?
Порой на сайтах у интерактивных элементов есть неприятные «заколдованные» места. Когда наводишь туда курсор, то попадаешь в некий «цикл дёрганий». Связано это со сменой состояний, когда срабатывает действие на hover, что-то происходит, под курсором оказывается другая логическая область, это что-то исчезает, и ты вновь оказываешься на начальной точке, вызывая первоначальное действие.
Покажу пример. Вот есть Твиттер, посмотрим на основной компононет — твит.
У многих людей прослеживается мысль о незначительности собственного вклада в любое общее дело, где много участников.
Что толку от голосования в ТСЖ?
Зачем ходить на выборы мэра, мой голос ничего не решает.
Я не могу повлиять на чистоту и благоустройство своего района.
Разве я могу взять и спасти экологию? Помочь обездоленным?
Не так давно на Гитхабе у репозиториев появилась кнопка Used by со счётчиком, который показывает количество зависимых репозиториев. По клику мы попадаем на страницу со списком.
Выглядит несколько неряшливо. Немного приблизим и добавим направляющую, чтобы яснее увидеть неприятные места.