Telegram Web
Жизненно?

👍 - Да.

🤔 - Нет, я спорю из-за фреймворков.

👉 @sWebDev | #юмор
👍19🤔151👎1
Fabric.js

Fabric.js — это библиотека JavaScript для работы с HTML5 Canvas, предназначенная для создания и манипулирования объектами в 2D-графике. Она поддерживает современные браузеры и предоставляет простой API для создания интерактивных и анимированных графических элементов. Fabric.js позволяет работать с различными объектами, такими как текст, изображения, формы и пути, а также предоставляет функции для трансформации и группировки объектов. Библиотека поддерживает экспорт и импорт данных в формате JSON или SVG, что облегчает сохранение и восстановление графических сцен.

👉 @sWebDev
4👍1
This media is not supported in your browser
VIEW IN TELEGRAM
Star trails

Анимированный трекер курсора на ThreeJS.

👉 @sWebDev
👍4
Сигналы и ngOnChanges для лучшего управления состоянием Angular

Статья сравнивает два подхода к управлению состоянием в Angular: использование Signals и ngOnChanges. В ней объясняется, что ngOnChanges является стандартным методом Angular для отслеживания изменений в данных компонентов, позволяя реагировать на изменения входных параметров. В то время как Signals предлагают альтернативный способ управления состоянием, предоставляя возможность более гибко и эффективно отслеживать изменения данных.

👉 @sWebDev
👍4
Первое собеседование, или Почему устроиться на работу сложнее, чем сдать экзамен

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

👉 @sWebDev | #собес
👍4👎2
Cesium.js

CesiumJS — это библиотека JavaScript, предназначенная для создания 3D-карт и геопространственных визуализаций в браузере. Она используется в различных приложениях, требующих отображения и анализа геопространственных данных.

👉 @sWebDev
🔥6
Отложенные представления в Angular

Когда загружается компонент, обернутый в @defer?

Забыли? Вернитесь к посту от 24.06.2024.

👉 @sWebDev
👍3
Бэкенд-разработчик сел за фронтенд.

👉 @sWebDev | #юмор
👍10
Suspense и React 19 RC

В React 19 RC рендер всех дочерних компонентов происходит после завершения загрузки данных, в отличие от React 18, где рендерились все компоненты и отображался fallback до завершения загрузки.

export default function App() {
return (
<Suspense fallback={<p>...</p>}>
<Header />
<Navbar />
<main>
<Content />
</main>
<Footer />
</Suspense>
)
}


При приостановке компонента происходит последовательная загрузка данных и создается «водопад» запросов.

Для решения этой проблемы нужно делать предварительные запросы на уровне роута:

export const Route = createFileRoute('/')({
loader: ({ context: { queryClient } }) => {
queryClient.ensureQueryData(repoOptions('tanstack/query'))
queryClient.ensureQueryData(repoOptions('tanstack/table'))
},
component: () => (
<Suspense fallback={<p>...</p>}>
<RepoData name="tanstack/query" />
<RepoData name="tanstack/table" />
</Suspense>
),
})


👉 @sWebDev
👍4
This media is not supported in your browser
VIEW IN TELEGRAM
Timekeeping

Cекундомер созданный с использованием Vue.js и GSAP.js.

👉 @sWebDev
👍4
Часто берете больничный?

❤️ - Да.

👍 - Я на удаленке, у меня каждый день больничный.

👉 @sWebDev
👍16👎2
Pixi.js

Pixi.js — это библиотека для создания 2D-графики с использованием WebGL и HTML5 Canvas. Она позволяет разработчикам создавать высокопроизводительные, интерактивные анимации прямо в браузере. Pixi.js поддерживает спрайты, текстуры, фильтры, текст, анимации и взаимодействие с пользователем. Библиотека также имеет модульную архитектуру, что позволяет расширять её функциональность через плагины и дополнительные модули.

👉 @sWebDev
👍3👎1
Media is too big
VIEW IN TELEGRAM
Инфографика

Интерактивная инфографика на Anime.js.

👉 @sWebDev
👍4
Коварные утечки памяти в React: как можно обжечься на useCallback и замыканиях

Статья обсуждает проблему утечек памяти в React-приложениях, вызванных сочетанием замыканий и хука useCallback. Автор объясняет, как замыкания удерживают ссылки на большие объекты, что может приводить к бесконечным утечкам памяти. Рассматриваются примеры кода и предлагаются рекомендации по предотвращению подобных проблем, такие как минимизация областей видимости замыканий и осторожное использование мемоизации.

👉 @sWebDev
👍8
Собеседование в IT-компанию: что нужно знать джуниору

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

👉 @sWebDev
5
This media is not supported in your browser
VIEW IN TELEGRAM
WakaTime

WakaTime — это плагин для отслеживания времени, предназначенный для разработчиков. Он интегрируется с текстовыми редакторами и IDE, а также с браузерами, такими как Chrome, и предоставляет автоматическое отслеживание времени, аналитику использования языков программирования и инструменты для повышения производительности.

👉 @sWebDev
👍5👎2
Работа с рендерингом в React

Какой метод реализует React.PureComponent для предотвращения ненужных рендеров?

Если забыли, то вернитесь к посту от 01.07.2024.

👉 @sWebDev
🔥3👎2👍1
Какой метод реализует React.PureComponent для предотвращения ненужных рендеров?
Anonymous Quiz
18%
componentDidMount;
61%
shouldComponentUpdate;
12%
componentWillUnmount;
10%
render.
👍3
Ленивое обнаружение роутов в React

Метод unstable_patchRoutesOnMiss в React Router позволяет загружать дополнительные роуты динамически, реализуя разделение кода.

Пример использования:
import { createBrowserRouter } from 'react-router-dom';

const router = createBrowserRouter(
[
{
id: "root",
path: "/",
Component: RootComponent,
},
],
{
async unstable_patchRoutesOnMiss({ path, patch }) {
if (path === "/a") {
let route = await getARoute();
patch("root", [route]);
}
},
}
);

async function getARoute() {
return { path: 'a', Component: A };
}

В этом примере, если пользователь переходит по пути /a, метод unstable_patchRoutesOnMiss загружает роут динамически и добавляет его к роуту root.

👉 @sWebDev
👍31
2025/07/10 15:59:22
Back to Top
HTML Embed Code: