Заметки разработчика
473 subscribers
667 photos
4 videos
1.16K links
Заметки о Frontend, Backend и немного DevOps. В основном о #PHP, #Laravel, #JavaScript, #HTML, #CSS, тестировании и настройке серверов.

https://www.dev-notes.ru

@snakenf
Download Telegram
💡 Совет по Laravel: Диски по требованию (on-demand)

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

📱 @dev_notes_ru

#Laravel #Facade #Storage #tips
Please open Telegram to view this post
VIEW IN TELEGRAM
👍1
👩‍💻 link rel='modulepreload': Оптимизация загрузки модулей JavaScript

rel='modulepreload' указывает, что скрипт модуля должен быть получен, проанализирован и откомпилирован заранее, и сохранён для последующего выполнения.


🖥 Читать статью

📱 @dev_notes_ru

#Frontend #HTML #JavaScript #Preload #Module
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥1
👩‍💻 Изучение Символов JavaScript

Глубокое погружение в JavaScript Символы — что это такое, чем они важны и как их эффективно использовать

Я помню, как впервые столкнулся с Символами в JavaScript. Это был 2015 год, как и многие разработчики, я подумал: "Отлично, ещё один примитивный тип, о котором нужно беспокоиться".

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

Symbol отличается от других примитивов JavaScript тем, что они гарантированно уникальны.

🖥 Читать статью

📱 @dev_notes_ru

#JavaScript #Symbol
Please open Telegram to view this post
VIEW IN TELEGRAM
👍1
💡 Совет по Laravel: Написание порядковых чисел

Начиная с Laravel v11.34, можно писать порядковые номера с помощью недавно появившегося метода spellOrdinal 🚀.

📱 @dev_notes_ru

#Laravel #Nuber #helpers #tips
Please open Telegram to view this post
VIEW IN TELEGRAM
👍2
👩‍💻👩‍💻 Кнопки с несколькими состояниями

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

🖥 Читать статью

📱 @dev_notes_ru

#Frontend #HTML #CSS #Button #MultiState
Please open Telegram to view this post
VIEW IN TELEGRAM
👍1🔥1
💡 Совет по Laravel: Сохранение уникальности заданий до начала обработки

Иногда в очереди может быть только одно задание, но как только оно начинает обрабатываться, в очередь можно поставить больше заданий. Laravel поставляется с контрактом ShouldBeUniqueUntilProcessing, позволяющим сделать именно это 🚀.

📱 @dev_notes_ru

#Laravel #Queue #tips
Please open Telegram to view this post
VIEW IN TELEGRAM
👍3
Чтобы заменить программистов роботами, клиенты должны будут точно описывать, чего они хотят.

Мы в безопасности.


📱 @dev_notes_ru

#joke
Please open Telegram to view this post
VIEW IN TELEGRAM
🤣5🔥3👏3
- Итак, улучшит ли рефакторинг кода время загрузки?
- Не совсем
- Улучшит безопасность?
- Нет
- Значит... это для совместимости с браузерами?
- Категорически нет
- Так скажите мне - почему всегда одна и та же старая история с вашими парнями, которые хотят всё рефакторить! МНЕ НУЖНО ЗНАТЬ!!!
- Потому что, как разработчики, если мы знаем, что оставили косячный код, мы не можем перестать думать об этом: когда просыпаемся утром, в обед, вечером, когда идем домой, и когда пытаемся заснуть.
- Он преследует нас, понимаешь? ОН ПРЕСЛЕДУЕТ НАС!👻

📱 @dev_notes_ru

#joke
Please open Telegram to view this post
VIEW IN TELEGRAM
👍4😁3
👩‍💻 JavaScript Set и Map: За пределами массивов и объектов

Как эффективно обрабатывать уникальные значения и пары ключ-значение, избегая принудительного приведения типов и потери производительности?

До того как в ES6 появились Set и Map, возможности хранения коллекций данных в JavaScript были ограничены. Использовались объекты для пар ключ-значение и массивы для списков. Это приводило к распространённым проблемам.

🖥 Читать статью

📱 @dev_notes_ru

#JavaScript #Set #Map
Please open Telegram to view this post
VIEW IN TELEGRAM
👍1
💡 Совет по Laravel: Метод `firstOrNew`

Иногда необходимо проверить, существует ли модель, и если нет, то создать её без сохранения в базе данных. Laravel поставляется с методом firstOrNew, позволяющим сделать именно это 🚀.

📱 @dev_notes_ru

#Laravel #Models #tips
Please open Telegram to view this post
VIEW IN TELEGRAM
👍2🔥1
👩‍💻 CSS :has() — Псевдокласс, который давно ждали

Псевдокласс :has(), устраняет давнее ограничение в CSS — невозможность стилизовать элементы на основе их содержимого.

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

Реляционный псевдокласс :has() — функциональный псевдокласс работающий как условная проверка содержимого элемента. Он позволяет применять стиль в зависимости от того, содержит ли элемент определённые дочерние элементы.

🖥 Читать статью

📱 @dev_notes_ru

#Frontend #CSS #has
Please open Telegram to view this post
VIEW IN TELEGRAM
👍3
💡 Совет по Laravel: Метод `keyBy`

Вам когда-нибудь нужно было создать ключ к коллекции по атрибуту из её элементов? Хотя это можно сделать при помощи хака с pluck, метод keyBy делает именно это 🚀.

📱 @dev_notes_ru

#Laravel #Collection #tips
Please open Telegram to view this post
VIEW IN TELEGRAM
👍1
👩‍💻 CSS content-visibility: Улучшение производительности веб-сайтов

CSS свойство content-visibility откладывает рендеринг элемента, включая компоновку и отрисовку, до тех пор, пока он не понадобится

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

Представьте: вы листаете огромную веб-страницу с сотнями изображений, сложными макетами и контентом, которого хватит на целую книгу. Без content-visibility браузеры послушно отображают каждый пиксель, независимо от того, видите его или нет. Это, как в ресторане — готовят каждое блюдо в меню на случай, если кто-то его закажет.

CSS свойство content-visibility сообщает браузерам, что они могут не рендерить элементы пока они вне области просмотра. Это может показаться простым, но для страниц с длинным скроллингом это очень важно.

🖥 Читать статью

📱 @dev_notes_ru

#Frontend #CSS #ContentVisibility
Please open Telegram to view this post
VIEW IN TELEGRAM
👍2🔥1
👩‍💻 Работа с JavaScript Scheduler API

Откройте возможности управления приоритетами и контроля выполнения задач в JavaScript с помощью нового Scheduler API. Новый подход поможет вам стать более продуктивными и эффективными в своей работе.

JavaScript Scheduler API представляет стандартизированный подход к управлению приоритетами задач в веб-приложениях.

Разработчики JavaScript исторически полагались на setTimeout(0) для передачи главного потока. Новый API обеспечивает более точный контроль над тем, как и когда выполняются задачи.

Традиционному подходу setTimeout к передаче главного потока не хватает детального контроля и правильной расстановки приоритетов. API Scheduler устраняет эти недостатки, предлагая более надёжное решение.

🖥 Читать статью

📱 @dev_notes_ru

#JavaScript #Scheduler
Please open Telegram to view this post
VIEW IN TELEGRAM
👍1🔥1
💡 Совет по Laravel: Метод `remove` Str

Вам когда-нибудь требовалось удалить несколько символов из текста? Хотя это можно сделать вручную с помощью функций PHP, Laravel предоставляет гораздо более удобную обертку remove, которая также может быть связана с другими методами 🚀.

📱 @dev_notes_ru

#Laravel #Str #tips
Please open Telegram to view this post
VIEW IN TELEGRAM
👍1
💡 Совет по Laravel: Метод `withWhereHas`

Вам когда-нибудь требовалось загрузить отношения в режиме жадной загрузки, но при этом ограничить их существование? Хотя это можно сделать вручную с помощью двух методов, Laravel поставляется с методом withWhereHas, позволяющим сделать именно это 🚀.

📱 @dev_notes_ru

#Laravel #tips
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
😁4🤣2
Описание работы vs Работа

📱 @dev_notes_ru

#joke
Please open Telegram to view this post
VIEW IN TELEGRAM
👍3
👩‍💻 HTML элемент search

24 марта 2023 года в спецификации HTML появился элемент search — специализированный контейнер для интерфейсов поиска.

Элемент <search> служит семантической обёрткой для форм поиска и фильтрующих компонентов UI. Он обеспечивает лучшую доступность, чем общие элементы <div>, и разъясняет назначение связанного с поиском контента как браузерам, так и вспомогательным технологиям.

До его появления разработчики полагались на типовые элементы div с ролями ARIA для обозначения областей поиска — решение приемлемое, но не идеально. Элемент search меняет ситуацию, предоставляя собственное семантическое значение для интерфейсов поиска и фильтрации.

🖥 Читать статью

📱 @dev_notes_ru

#html #search
Please open Telegram to view this post
VIEW IN TELEGRAM
👍1
👩‍💻 CSS единицы измерения lh и rlh

Изучение новых относительных единиц измерения CSS основанных на высоте строки и позволяющих отказаться от угадывания вертикального ритма.

🖥 Читать статью

📱 @dev_notes_ru

#Frontend #CSS #lh #rlh
Please open Telegram to view this post
VIEW IN TELEGRAM
👍2🔥2
Дорогой Санта я хочу создать операционную систему с помощью HTML

📱 @dev_notes_ru

#joke
Please open Telegram to view this post
VIEW IN TELEGRAM
🤣42