​​Почему стоит перейти с поиска Google на DuckDuckGo — https://www.quora.com/Why-should-I-use-DuckDuckGo-instead-of-Google

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

Та же история и с умными лентами соцсетей: они тоже помещают нас в пузырь, в котором мы видим только приятные нам материалы, скрывая от нас альтернативные мнения.

​​Программирование без дураков

Книга оказалась довольно общим руководством по работе программистом. Найдёте в ней рекомендации по написанию/чтению кода, работе в команде, поверхностный обзор общих концепций и инструментов. Будет особенно полезна джуниорам, но и мидлы, скорее всего, найдут для себя что-то новое — http://andrew-r.ru/notes/weniger-schlecht-programmieren

Почему браузер читает CSS-селекторы справа налево

Если вы не знали об этом, браузер читает селекторы справа налево, то есть обрабатывая селектор #widget .heading span он в первую очередь найдёт все спаны, затем выберет только те, которые лежат внутри .heading, а затем оставит только спаны, лежашие внутри #widget.

Звучит нелогично, но причина такого поведения в том, что задачи разработчика и браузера несколько отличаются. Задача разработчика при чтении или составлении селектора — получение соответствующего ему набора элементов. А для понимания задачи браузера нужно немного контекста.

Прежде чем отрисовать страницу, браузер строит дерево отображения (render tree). Оно состоит из объектов отображения — визуальных элементов страницы, расположенных в том же порядке, в котором они должны быть выведены на страницу. Дерево отображения строится на основе DOM, но в него не попадают невизуальные элементы вроде head или элементы с display: none;, а сложным элементам вроде select могут соответствовать несколько объектов отображения.

Отрисовка страницы состоит из нескольких этапов, но один из основых этапов — компоновка объектов отображения. На этом этапе браузер проходит по дереву отображения и рассчитывает размеры и положение каждого объекта на странице. Чтобы посчитать для объекта отображения эти значения, браузеру нужно знать стили, которые применены к этому объекту. Для этого ему нужно найти в таблице стилей все блоки правил, применяемые к элементу, соответствующему объекту отображения. И здесь мы подошли к ответу на исходный вопрос.

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

Рассмотрим тот же пример с селектором #widget .heading span. Предположим, что браузеру нужно определить, подходит ли этот селектор к элементу div. Если бы браузер читал селектор слева направо, ему бы пришлось найти на странице элемент с идентификатором widget, внутри него найти все элементы с классом .heading, а затем найти внутри все span и проверить, есть ли среди них тот самый div. Это очень много работы. А благодаря чтению справа налево браузер может сразу определить, что span и div — принципиально разные элементы и поэтому селектор не подходит.

​​Организация файлов по фичам, а не техническим аспектам

Если вы используете Редакс и в корне вашего проекта есть директории actions, reducers, constants и selectors, попробуйте другой подход к организации файловой структуры (если не используете Редакс, тоже может оказаться полезным) — http://andrew-r.ru/notes/features-not-tech-aspects

​​Атлант расправил плечи

Книга художественная, но с понятной пользой: рассказывает о вреде социализма и преимуществах капитализма применительно к повседневной жизни.

http://andrew-r.ru/notes/atlas-shrugged

​​Кастомные элементы ГитХаба

ГитХаб ещё с 2014 года использует веб-компоненты в продакшене. Часть компонентов инженеры ГитХаба выложили в опенсорс:

— custom-element boilerplate, стартовый шаблон для веб-компонента;
— time-elements расширяет возможности стандартного <time>;
— clipboard-copy при клике копирует заданный текст в буфер обмена;
— auto-check автоматически валидирует значение поля через указанную ручку серверного API;
— markdown-toolbar реализует кнопки для форматирования текста в markdown в <textarea>;
— image-crop реализует интерфейс обрезания фоточек;
— include-fragment подгружает фрагмент HTML и заменяет себя им;
— task-lists реализует список задач с поддержкой drag’n’drop;
— auto-complete реализует поле ввода с автодополнением и подгрузкой вариантов с сервера;
— details-menu реализует выпадающее меню на основе элемента <dialog>;
— details-dialog реализует модальное окно на основе элемента <dialog>.

Кажется, это и есть будущее разработки интерфейсов. jQuery-плагины морально устарели, React/Vue/Angular-компоненты сильно всё усложняют и плохо влияют на производительность, а кастомные элементы максимально просты (подключаешь скрипт и используешь их в любом месте разметки) и работают на основе нативных возможностей браузера.

​​Два немецких студента в качестве дипломной работы сделали прототип браузера будущего. Мне особенно понравился концепт истории посещений в виде таймлайна, гораздо лучше обычного списка сайтов — https://refresh.study

​​​​Юридические вопросы

Всем приходится сталкиваться с юридическими вопросами, самые частые случаи — отношения между работником и работодателем, заказчиком и фрилансером, гражданином и государством. Большинство материалов на юридические темы пишутся ужасно канцелярским языком, так что разобраться в них нелегко. К счастью, есть исключения, их и порекомендую.

Ребята из Т—Ж делают крутое СМИ про деньги, в котором простым языком разбирают юридические вопросы вроде аренды/покупки недвижимости, налоговых вычетов и всего подобного → https://journal.tinkoff.ru/

Ребята из «Модульбанка» ведут «Дело» — издание для предпринимателей, в котором так же просто рассматриваются взаимоотношения предпринимателя и государства → https://delo.modulbank.ru/

Юристы Владимир Беляев и Дарья Тимохина делятся лаконичными шаблонами документов без воды и канцелярита → http://outlaw.center/documents.html

​​Наконец дошли руки до постепенного обновления сайта Форвеба. Выкинул Вордпресс, перешёл на статику, минимально задизайнил, выкинул старые неактуальные статьи, но впереди всё ещё много работы.

Если интересно, следите за разработкой — github.com/forwebdev/site
Заходите почитать статьи, если ещё их не видели — forwebdev.ru

​​«Цель» Голдратта

Доступное и увлекательное введение в теорию ограничений, применимую практически к любому процессу, системе и даже к личной жизни — http://andrew-r.ru/notes/goldratt-the-goal

Как составить личный финансовый план и как его реализовать

https://www.mann-ivanov-ferber.ru/books/mif/finplan/

По рекомендации @dielone (спасибо!) прочитал книгу о том, как взять под контроль свои финансы, начать откладывать и не потерять сбережения. По сути обо всём этом должны рассказывать в школе ¯\_(ツ)_/¯

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

Всё сводится к контролю доходов и расходов и регулярному инвестированию (это возможно при любом уровне дохода). Автор доступно и поверхностно рассказывает об инструментах инвестирования вроде облигаций, ПИФов, ETFов, акций, валют и драгоценных металлов, и объясняет риски и преимущества каждого инструмента.

---

Кстати, если вам тоже интересны инвестирование и защита накоплений от инфляции, ребята из чатика Форвеба сделали отдельный ламповый тематический чат, присоединяйтесь и делитесь опытом или задавайте вопросы — https://t.me/joinchat/Cm9nK1B1_XOmiLDQOtgfcg

Неплохая идея для улучшения UX формы регистрации: новая версия Chrome предлагает использовать автоматически сгенерированный рандомный пароль

Пользуетесь менеджерами паролей?
anonymous poll

Не пользуюсь и придумываю пароли сам – 212
👍👍👍👍👍👍👍 43%

Пользуюсь и генерирую рандомные пароли – 154
👍👍👍👍👍 31%

Пользуюсь и придумываю пароли сам – 104
👍👍👍 21%

Не пользуюсь и генерирую рандомные пароли – 25
👍 5%

👥 495 people voted so far.

Удивительно, что по результатам опроса большинство не пользуется менеджерами паролей и придумывают пароли сами. Кажется, такой вариант жизнеспособен только если у вас хорошая память или если вы используете один и тот же пароль на многих сайтах 🤔 Раньше я тоже почти везде использовал один и тот же пароль, но горький опыт научил меня так не делать.

Одним утром я открыл Телеграм и увидел в @forwebdev рекламу каких-то миостимуляторов, которую не публиковал; оказалось, что незадолго до этого произошла утечка данных одного сервиса, и мой пароль на этом сервисе совпадал с паролем моего аккаунта в Амплифере. Злоумышленники каким-то образом получили доступ к моему и ещё нескольким аккаунтам в Амплифере и опубликовали эту злочастную рекламу. Рекламу я удалил, но картинки из неё теперь живут в виде стикеров.

Когда используешь один и тот же пароль на разных сайтах ↑

Читатель делится способом запоминать пароли без мучений (правда утечка паролей такого вида всё равно опасна):

​​Хорошая статья на Т—Ж о том, с чего следует начинать любой стартап или бизнес: исследование потребностей клиента. TL; DR в прикреплённом скриншоте. Ну а у меня к статье есть яркий пример того, как делать стартапы не нужно.

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

​​Нашёл достойную замену адблоку: umatrix.

Это бразуерное расширение, которое по умолчанию запрещает сайтам доступ к сторонним ресурсам вроде скриптов и кук с других хостов (запрет на доступ к какому-то ресурсу при необходимости можно снять). Если адблок блокирует только рекламу (и то не всю), то umatrix блокирует ещё и всякую гадость вроде скриптов аналитики и трекинга.

Что нужно делать, чтобы стать техническим директором?

Из книги Камиль Фурнье «От разработчика до руководителя»:

«Найдите работу, где вам будут передавать практический опыт и вместе с тем дадут возможность получать новые технические навыки.

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

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

Развивайтесь в смежных областях: хороший техдир должен разбираться в проектном менеджменте, уметь вести техническую документацию и иметь хорошие коммуникативные способности.

Технические директора в большинстве работают в небольших компаниях, часто являясь их соучредителями. Если вы хотите пойти таким путём, найдите компанию, из которой ранее уже уходили сотрудники, чтобы основать что-то своё. Именно в ней вы сможете найти своих будущих соучредителей или возможность быстро попасть в новую компанию»