Веб-разработка *

Расскажем об утилитах, которые помогут оценить производительность сайта и повысить его безопасность. В списке есть как новые инструменты — например, Fast or Slow от авторов плагина Wordfence для WordPress, так и проверенные временем системы вроде Mozilla Observatory.

^{Больше бенчмарков, в том числе для серверов Linux.}

Возможно, вы уже слышали про Alpine.js. Если нет, то это "Vue.js на минималках". "Angular 1 для миллениалов". Называйте, как хотите, главное, чтобы вам было понятно.

Зачем нам еще один фреймворк? Ну, Alpine хорошо вписывается в свою нишу. По факту, он – альтернатива большим фреймворкам для сайтов, где эти большие фреймворки не нужны. Например, меня, модного web-developer'а, запрягли писать многостраничный сайт. Мне нужно элементарно сделать форму и всякий другой интерактив. Что я буду делать? Возьму jQuery – друзья не поймут, на чистом JS всё писать тоже не комильфо. К тому же я уже знаю реакты, ангуляры и вью, знаю, что такое data-driven подход. Как мне теперь данные до отправки в HTML хранить?

Тут и приходит на помощь Alpine.js. Можно, конечно, Vue или React прикрутить. Но React без JSX никто в здравном уме писать не будет, а Vue минифицированный через CDN весит 34 kB (против 8.1 kB у Alpine). Так и получается, что выбор падает на Alpine.

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

Недавно вышла статья "Хороший ли выбор Svelte для реализации виджета?" с опытом реализации проекта с критичным размером бандла. Это отличный повод проверить обещания пиарщиков Svelte на реальном проекте.

Давайте его проанализируем!

В последние годы JavaScript развивается очень быстро. Особенно это характерно для периода, следующего за выходом стандарта ES6 в 2015 году. С тех пор в языке появилось множество замечательных возможностей. Немало нового было предложено и для включения в стандарт ES2020.



Уже сформирован окончательный список возможностей, появления которых можно ожидать в стандарте после его утверждения. Это — хорошая новость для всех любителей JS. Автор статьи, перевод которой мы сегодня публикуем, говорит, что среди этих возможностей есть такие, которым он особенно рад. До их появления ему, в тех ситуациях, в которых они применимы, было гораздо тяжелее писать код. По его словам, появись они в языке раньше, они сэкономили бы ему много времени и сил.

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



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

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

Уроки, полученные от написания следующей основной версии Vue.js

Автор: Эван Ю (Evan You)

В течение прошлого года команда Vue работала над следующей основной (major) версией Vue.js, которую мы надеемся выпустить в первой половине 2020 года (эта работа продолжается на момент написания данной статьи). Идея новой основной версии Vue сформировалась в конце 2018 года, когда кодовой базе Vue 2 было около двух с половиной лет. Это может показаться не таким уж долгим периодом в жизни программного обеспечения, но идеи фронт-энда сильно изменились за этот период.

Это перевод статьи с ресурса dev.to. Ее автор Fayaz Ahmed делится списком своих любимых инструментов для разработчиков.



Я разрабатываю такие проекты, как Tvflix, GSON, Appy Dev, а также множество различных микропроектов, поэтому увлекаюсь поиском бесплатных инструментов для моей работы.

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

Если в приложении нужно выводить много графических данных, диаграмм, интерактивных виджетов – важно позаботиться о UX, чтобы пользователю было удобно работать. Способ вывода данных особенно важен, если приложение открывают и на мониторах, и на смартфонах. Делимся опытом, как мы реализовали достаточно нетривиальное решение – кастомный скролл с помощью библиотеки визуализации данных d3.js.

На данном вебинаре вы узнаете как модернизировать ваши приложения и перенести их в облако. А также на конкретных примерах рассмотрите архитектуру современного облачного приложения, познакомитесь с сервисами Azure для разработчиков и способы реализации DevOps практик от Microsoft. В демонстрации будут показаны следующие сервисы Azure: App Service, Application Insights, Azure Functions, Azure DevOps, SQL Azure.

Когда: 4 июня 2020 года.

Регистрируйтесь и приходите (онлайн)! Ну а под катом программа.

Доброго времени суток.

Представляю вашему вниманию перевод статьи «Algorithms on Graphs: Let’s talk Depth-First Search (DFS) and Breadth-First Search (BFS)» автора Try Khov.

Что такое обход графа?

Простыми словами, обход графа — это переход от одной его вершины к другой в поисках свойств связей этих вершин. Связи (линии, соединяющие вершины) называются направлениями, путями, гранями или ребрами графа. Вершины графа также именуются узлами.

Двумя основными алгоритмами обхода графа являются поиск в глубину (Depth-First Search, DFS) и поиск в ширину (Breadth-First Search, BFS).

Несмотря на то, что оба алгоритма используются для обхода графа, они имеют некоторые отличия. Начнем с DFS.

Идея о том, что можно писать веб приложение без JavaScript интересна многим, а особенно тем кто начинал свой путь в программирование с серверного языка. Внедрение Web Assembly может (наконец-то) позволить это полноценно реализовать. Писать всю логику приложения на одном языке — звучит довольно заманчиво. Тем более, если этот код компилируется в бинарник, а не в промежуточный язык.

Эту технологию хотелось бы увидеть в не типичных веб-приложениях. Например, как это — писать что-то более интерактивное на Web Assembly (Blazor). Предлагаю попробовать создать простую текстовую интерактивную игру. В игре есть возможность создать свой вопрос и отвечать на вопросы других игроков, набирая очки за правильные ответы. Всё на одной странице и с помощью Blazor.



Результат:

Github
Demo

Всем привет! В очередной статье мы представляем вам список из 10 компаний, для которых использование Фигмы стало отправной точкой на пути к новым вершинам.

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

Возможно, вы планируете разработать собственный перспективный проект и думаете над тем, какой инструмент использовать. Или работаете в компании, которая пользуется другими инструментами для дизайна и прототипирования. В любом случае, после прочтения этой статьи — у вас будет еще +10 причин начать использовать Фигму.

Доброго времени суток! Как известно, одной из характерных черт JavaScript, наряду c мультипарадигменностью, слабой (динамической) типизацией, автоматическим управлением памятью и прототипным наследованием, является тот факт, что JS — это однопоточный (синхронный) язык.

Что касается синхронности, то ключевым элементом здесь выступает стек вызовов (call stack). Если вы впервые о нем слышите, то настоятельно рекомендую прочитать эту статью и посмотреть это видео.

Насколько хорошо вы знакомы с тем, как работает JS под «катом»?

Давайте проверим.

Пролог

Недавно я узнал о "карманном" PaaS похожем на Heroku с довольно очевидным названием — Dokku. Очень привлекла возможность простого добавления сертификата к приложению и vhost из коробки, поэтому я решил перенести свои docker образы на Dokku. Правда, я был разочарован тем, что в Dokku нет команд подобных Heroku

dokku container:push
dokku container:release
// Очень было бы удобно, но еще нет :(

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

Для любого сайта важно правильно настроить HTTP-заголовки. На тему заголовков было написано много статей. Здесь мы обобщили накопленный опыт, документацию RFC. Какие-то из заголовков обязательные, какие-то устаревшие, какие-то могут вносить путаницу и противоречия. Мы сделали пузомерку для автоматической проверки HTTP-заголовков веб-сервера. В отличии от многих других сервисов, которые просто показывают заголовки, данный сервис позволяет:

1. задать значение типовых заголовков;
2. добавить свои произвольные заголовки;
3. указать версию HTTP-протокола: 1.0, 1.1, 2 (проверяет поддерживается ли HTTP/2);
4. указать метод запроса, время ожидания и данные postdata для отправки на сервер;
5. также пузомерка проверяет корректность ответа на запросы If-Modified-Since, If-None-Match, если в ответе сервера есть Last-Modified или ETag.

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

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



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

Пару дней назад я ковырялся в блоге Creditkarma и заметил такой HTTP-заголовок:

X-hacker: If you're reading this, you should visit wpvip.com/careers and apply to join the fun, mention this header.

(X-hacker: если вы это читаете, то вам следует зайти на wpvip.com/careers и подать заявку, чтобы присоединиться к веселью, упомяните этот заголовок).

Первой мыслью было: «Ничего себе, когда-то программисты ввели баг тысячелетия, чтобы сэкономить несколько бит на дате, и теперь у компании публикуют целые предложения о работе в заголовке HTTP!»

Мне стало очень интересно, и я провёл некоторые исследования.