Заметки разработчика

👩‍💻 Как деструктуризация массивов может замедлить JavaScript код В статье я расскажу об оптимизации использования деструктурирующего присваивания для повышения производительности. Рассмотрим различия в байткоде между двумя подходами к деструктурирующему присваиванию. Я проведу тест, подчёркивающий эти различия, и в конце вы поймёте, почему ArrayAssignmentPattern не всегда является лучшим выбором. 🖥 Читать статью 📱 @dev_notes_ru #JavaScript #tips

👩‍💻 Новое в Symfony 7.2: Улучшения языка выражений В Symfony 7.2 улучшен компонент ExpressionLanguage, добавлены новые битовые и логические операторы, упрощена регистрация кастомных провайдеров и реализована поддержка комментариев. Компонент ExpressionLanguage предоставляет механизм, позволяющий компилировать и оценивать выражения. Основное назначение компонента — позволить пользователям использовать выражения внутри конфигурации для более сложной логики. В Symfony 7.2 мы улучшили его, добавив новые возможности. 🖥 Читать статью 📱 @dev_notes_ru #Symfony #features #ExpressionLanguage

👩‍💻 Новое в Symfony CLI: автодополнение команд Как разработчики, мы проводим много времени в терминале, выполняя десятки команд. Некоторые команды могут быть длинными или сложными, похожими на другие инструменты, но не совсем такими же! Именно поэтому многие из нас любят автодополнение. Хорошая новость заключается в том, что начиная с Symfony CLI v5.10, Symfony CLI предоставляет автодополнение команд для оболочек Bash, ZSH и Fish. Чтобы включить его, следуйте инструкциям, отображаемым командой symfony completion --help. Но это ещё не всё! Знаете ли вы, что Symfony Console обеспечивает автодополнение команд bin/console в вашей оболочке? Да! Начиная с версии 5.4 для Bash, 6.1 для Fish и 6.2 для ZSH. Поэтому Symfony CLI может перенаправлять инструкции автодополнения команд в проект Symfony при автодополнение команд symfony console из коробки! Но и это ещё не всё! Вы, наверное, знаете, что сам Composer использует Symfony Console. Так что да, в symfony composer тоже будет работать! Это отличный вариант для тех, кто работает над несколькими проектами с разными окружениями, версиями Symfony или PHP, чтобы получить автодополнение команд, работающее без сбоев. В качестве небольшого приятного бонуса, поскольку Symfony CLI также разработан с использованием автономных библиотек с открытым исходным кодом, эта функция автодополнения команд теперь доступна для любого инструмента, использующего symfony-cli/console, как, например, Blackfire CLI. 📱 @dev_notes_ru #Symfony #cli

👩‍💻+👩‍💻 Вкладки со скруглёнными углами и границами Пример переключения между вкладками от Ana Tudor

Изначально я сделала это после того, как кто-то спросил, как создать вкладки с закругленными углами и границами.

👩‍💻 https://codepen.io/thebabydino/pen/oNKLLbv Ванильный CSS + JS + немного SVG-магии.🪄 📱 @dev_notes_ru #CSS #JS #codepen #tips

💡 Совет по Laravel: Перемещение столбца на первую позицию Знаете ли вы, что можно переместить столбец на первую позицию в таблице, даже если он была добавлен позже? Для этого используйте метод first() 🚀. 📱 @dev_notes_ru #laravel #migration #tips

👩‍💻 Напоминание, что @scope и блоки стилей HTML — это мощное сочетание Существует так много различных инструментов для написания CSS с ограниченной областью видимости с очень разными взглядами на то, как это делать. Иногда это лишь подфункция инструмента, выполняющего другие задачи. Но, как правило, это концепция, требующая инструментария для реализации. 🖥 Читать статью 📱 @dev_notes_ru #frontend #css #scope

👩‍💻 Новое в Symfony 7.2: Silent Verbosity Symfony 7.2 представляет silent verbosity для подавления всего вывода, включая ошибки. При работе с некоторыми сторонними сервисами может потребоваться, чтобы приложение Symfony создавало логи в формате JSON для более удобной интеграции. К счастью, этого можно легко добиться с помощью интеграции Symfony с Monolog. Однако при выполнении некоторых консольных команд они могут генерировать вывод как в потоке stdout, так и в потоке stderr. Это проблематично, если сторонний сервис ожидает только JSON-файлы логов и сталкивается с этими неструктурированными данными. 🖥 Читать статью 📱 @dev_notes_ru #Symfony #features #verbosity

👩‍💻 CSS эффект Slice от Ana Tudor

Slice! - одно из моих любимых и, безусловно, самое популярное демо, которое я сделала в этом году.

Никакого JS, никакого дублирования текста, никаких изображений, кроме CSS-градиентов. SVG-фильтры позаботились как о текстуре, так и об эффекте «slice + offset».🪄 Также contenteditable.😼 👩‍💻 https://codepen.io/thebabydino/pen/GRaKbZo 📱 @dev_notes_ru #CSS #effects #codepen #tips

👩‍💻 Совет по коллекциям в Laravel Если хотите получить последний элемент коллекции, то это $collection->last(). Но что насчет предпоследнего? Ответ - ->take(-2)->first(). Да, а вы знали, что take() принимает отрицательные числа? 📱 @dev_notes_ru #laravel #collection #tips

👩‍💻 Что такое Docker и как он устроен Docker произвёл революцию в создании, доставке и работе приложений, представив подход контейнеризации, объединяющий различные технологии для упаковки и развёртывания программного обеспечения. Давайте рассмотрим концепции, лежащие в основе Docker. 🖥 Читать статью 📱 @dev_notes_ru #DevOps #Docker

👩‍💻 Новое в Symfony 7.2: Week, WordCount и Yaml ограничения В Symfony 7.2 появилось три новых ограничения: первое проверяет номера недель, второе проверяет количество слов, а третье проверяет синтаксис YAML. Это первая статья из цикла рассказывающего о наиболее важных нововведениях в Symfony 7.2, релиз которой состоится в конце ноября 2024 года. 🖥 Читать статью 📱 @dev_notes_ru #Symfony #features

🤔 А вы знаете о методе withoutDelay() в Laravel Queue? Queue в Laravel позволяют выполнять код (Jobs) в фоновом режиме, быстро отвечая на запросы пользователей. Чтобы отправить задания в очередь, используется метод dispatch() соответствующего класса Job. Иногда в заданиях может быть задана задержка по умолчанию, например, переопределением метода delay(). Если в определенном сценарии необходимо отправить задание немедленно, можно добавить метод withoutDelay() к вызову метода dispatch(), и задание будет отправлено без задержки. 📱 @dev_notes_ru #laravel #queue #tips

👩‍💻 Руководство по деструктуризации в JavaScript Если вы проводите много времени, пробираясь через современный JavaScript, то, скорее всего, встречали столько многоточий (...), что даже самый задумчивый герой ролевых игр 90-х был бы посрамлён. Я не буду винить вас за то, что вы находите их немного запутанными. Конечно, я не виню вас за то, что находите что-то в JavaScript запутанным, но я всегда считал эти многоточия уникально не интуитивными с первого взгляда. Не помогает и то, что часто сталкиваетесь с этими маленькими чудаками в контексте деструктурирующего присваивания, которое само по себе является странным синтаксисом. 🖥 Читать статью 📱 @dev_notes_ru #JavaScript #spread #rest #guide

#joke 📱 @dev_notes_ru

👩‍💻 Ставить точку с запятой или нет С тех пор как я начал изучать этот язык, JavaScript претерпел ряд серьезных изменений. В первую очередь, похоже, стало нормой не использовать точки с запятой. Популярные проекты, такие как Vue, похоже, не используют их вообще. Люди утверждают, что автоматической вставки точки с запятой (ASI) достаточно. Не нужно печатать больше, чем нужно. Так ли важна точки с запятой на самом деле? ✅ Вопрос мнения Вы можете подумать, что использование точки с запятой зависит от мнения разработчика - использовать её или нет, в зависимости от того, что он предпочитает. Однако возникает вопрос. Действительно ли они необходимы при любых обстоятельствах? Ответ - да. Точки с запятой действительно необходима при определенных обстоятельствах, и отсутствие точки с запятой может привести к ошибкам в коде. Рассмотрим несколько примеров, когда точка с запятой абсолютно необходима в JavaScript. ✅ Несколько выражений в одной строке Не знаю, зачем кому-то понадобилось писать такой код, но взгляните на него:

let x = 5; let y = 10; console.log(x + y);

Если убрать точки с запятой и вставить код в консоль, возникнет синтаксическая ошибка: unexpected token: 'let'. Возможно, нужно просто написать быстрый скрипт, чтобы сделать какую-то хитрость на веб-странице. В этом случае необходимо использовать точки с запятой. ✅ Немедленно вызываемые функциональные выражения (IIFE) Точка с запятой особенно важна, когда новая строка начинается с открытой круглой скобки ( или открытой квадратной скобки [. Эти символы могут быть неправильно интерпретированы движком JavaScript, если точка с запятой не поставлена, так как JavaScript может предположить, что вы пытаетесь немедленно вызвать функцию или получить доступ к массиву.

let x = 5
(function() {
  console.log('Hello, world!');
})(); // Uncaught TypeError: 5 is not a function

Этот код выглядит невинно, но JavaScript попытается интерпретировать вторую строку так, как будто она является частью первой, что совершенно бессмысленно, и действительно приведет к ошибке. Конечно, добавление точки с запятой в конце первого утверждения устраняет проблему. ✅ Согласованность между языками Если вы разработчик, работающий с несколькими языками программирования, использование точек с запятой поможет сохранить единый стиль кодирования. Во многих других языках, таких как Java, C# и C++, точка с запятой является обязательной. Переключение между языками, в одном из которых нет точек с запятой, иногда может привести к простым ошибкам (и огромному раздражению), когда переключаешься на другой язык, где они требуются. ✅ Использовать или не использовать точку с запятой JavaScript позволяет опускать точки с запятой во многих ситуациях, но я считаю, что для ясности, удобства сопровождения и во избежание головной боли (и сумасшествия) лучше использовать точки с запятой в коде. Это также поможет сохранить последовательность в разных языках. Так что, серьезно... почему бы и нет? #JavaScript #semicolon

💡 Совет по Laravel: Хелпер `today()` Иногда нужно получить сегодняшнюю дату. Хотя это можно сделать несколькими способами, Laravel поставляется с понятным хелпером today(), предназначаемым именно для этого. Можно передавать часовые пояса и подключать другие полезные методы 🚀. 📱 @dev_notes_ru #laravel #helper #tips

👩‍💻 Практические советы по доступности, которые можно применить сегодня Мы все бывали там, когда, торопясь уложиться в срок, создавали выпадающее меню или модальное окно, не задумываясь о его доступности. Но что, если внести несколько небольших изменений, которые могли бы значительно улучшить работу с сайтом для широкого круга пользователей? Доступность не должна быть сложной задачей или галочкой в графе соответствие. Речь идёт о создании продуктов, которыми могут пользоваться все, независимо от их способностей, технической грамотности, операционной системы или устройства. В этой статье я поделюсь практическими советами о том, как правильно разметить три распространённых шаблона пользовательского интерфейса. Независимо от того, являетесь ли вы новичком в области доступности или просто нуждаетесь в освежении, эти советы помогут создавать более инклюзивные интерфейсы. Также привожу ссылки на примеры реализации и внешние ресурсы, чтобы можно было воочию убедиться, как эти изменения влияют на удобство использования. Вы увидите, как несколько продуманных корректировок могут изменить всё к лучшему. 🖥 Читать статью 📱 @dev_notes_ru #frontend #a11y #html #tips

#joke 📱 @dev_notes_ru

💡 Совет по Laravel: Просмотр информации о модели Когда модель разрастается, бывает сложно проверить все связи, включая связи из сторонних пакетов, зарегистрированные события и наблюдателей. В этом случае можно использовать команду model:show 🚀. 📱 @dev_notes_ru #laravel #artisan #tips

👩‍💻 Создание анимации орбиты с помощью CSS переменных Давайте анимируем CSS переменные! Это мощный способ применения CSS анимации, которая в противном случае была бы утомительной или непрактичной. 🖥 Читать статью 📱 @dev_notes_ru #frontend #css