Как стать автором
Обновить
1
0
Максимка Назарьев @acupofspirt

Frontend-разработчик

Отправить сообщение

WebGL-ветер и программирование GPU. Лекция на FrontTalks 2018

Время на прочтение11 мин
Количество просмотров9.6K
Для отрисовки сложной графики на веб-страницах существует библиотека Web Graphics Library, сокращенно WebGL. Разработчик интерфейсов Дмитрий Васильев рассказал о программировании GPU с точки зрения верстальщика, о том, что из себя представляет WebGL и как мы с помощью этой технологии решили проблему визуализации больших погодных данных.


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

Всего голосов 32: ↑31 и ↓1+30
Комментарии5

Вольный опус про найм, собеседования и трэш на рынке IT-кадров

Время на прочтение11 мин
Количество просмотров95K

Нынче программист может не найти работу в двух случаях: он либо клинический дятел и неадекват, либо хочет в качестве оклада звездолёт. Во всех остальных случаях "в девках" он долго не задерживается. Однако вопрос "кто кого на***л?" интересует обе стороны "противостояния". Так же всем хочется знать цену вопроса и как бы расширить целевую аудиторию, побыстрее найти наилучшее предложение и отвадить всяких отмороженных. Ну и, конечно же, есть чисто-программерское "чтобы внутренний перфекционист был спокоен". Обо всём этом по чуть-чуть и поразмышляю в текстовой форме.

Клац
Всего голосов 179: ↑168 и ↓11+157
Комментарии304

Как работает JS: движки рендеринга веб-страниц и советы по оптимизации их производительности

Время на прочтение12 мин
Количество просмотров52K
Сегодня, в переводе одиннадцатой части серии материалов, посвящённых JavaScript, мы поговорим о подсистемах браузера, ответственных за рендеринг веб-страниц. Они играют ключевую роль в деле преобразования описаний документов, выполненных с помощью HTML и CSS, в то, что мы видим на экране.

image

Автор материала говорит, что в компании SessionStack приходится уделять рендерингу огромное внимание. В этой статье он поделится советами, касающимися оптимизации веб-страниц с учётом особенностей их визуализации.
Читать дальше →
Всего голосов 18: ↑16 и ↓2+14
Комментарии6

Возможно, вам не нужен Rust, чтобы ускорить ваш JS

Время на прочтение32 мин
Количество просмотров28K

Несколько недель назад я обнаружил пост "Окисляем Source Maps с Rust и WebAssembly"
распространяющийся по Твиттеру и расказывающий о выигрыше в производительности от замены обычного JavaScript в библиотеке source-map на Rust, скомпилированный в WebAssembly.


Пост возбудил мой интерес не потому, что я большой фанат Rust или WASM, скорее потому что я всегда интересовался фичами языков и оптимизациями, которых не хватает Javascript для того чтобы достичь аналогичной производительности.


Так что я скачал библиотеку с GitHub и отправился в небольшое исследование производительности, которое я документирую здесь практически дословно.

Читать дальше →
Всего голосов 58: ↑54 и ↓4+50
Комментарии43

Майнинг и как он работает: матчасть

Время на прочтение6 мин
Количество просмотров559K

Привет, %username%!
Я расскажу и покажу как работает основа генерации денег в криптовалютах — майнинг. Как создается первый блок, новые блоки и как появляются деньги из ниоткуда.
Чтобы было проще понять, мы напишем свой импровизированный майнер для импровизированной криптовалюты HabraCoin.
Читать дальше →
Всего голосов 274: ↑252 и ↓22+230
Комментарии482

Сегментация памяти (Схема памяти компьютера)

Время на прочтение19 мин
Количество просмотров55K
Представляю, Вам, перевод статьи одного из разработчиков PHP, в том числе версии 7 и выше, сертифицированного инженера ZendFramework. В данный момент работает в SensioLabs и большую часть занимается низкоуровневыми вещами, в том числе программированием в С под Unix. Оригинал статьи здесь.

Ошибка Сегментации: (Компьютерная верстка памяти)


Несколько слов, о чем эта запись в блоге


Я планирую в будущем писать технические статьи о PHP, связанные с глубоким пониманием памяти. Мне нужно, чтобы мои читатели имели такие знания, которые им помогут понять некоторые концепции дальнейшего объяснения. Для того, чтобы ответить на этот вопрос, нам придется перемотать время назад в 1960-е года. Я собираюсь объяснить вам, как работает компьютер, а точнее, как происходит доступ к памяти в современном компьютере, а затем вы поймете, из-за чего происходит это странное сообщение об ошибке — Segmentation Fault.

То, что вы будете читать здесь, краткое изложение основ дизайна компьютерной архитектуры. Я не буду заходить слишком далеко, если это не нужно, и буду использовать хорошо известные формулировки, так что, кто работает с компьютером каждый день может понять такие важные понятия о том, как работает ПК. Существует много книг о компьютерной архитектуре. Если вы хотите углубиться дальше в этой теме, я предлагаю вам достать некоторые из них и начать читать. Кроме того, откройте исходный код ядра ОС и изучите его, будь то ядро Linux, или любое другое.
Читать дальше →
Всего голосов 22: ↑19 и ↓3+16
Комментарии7

Как оживить картинку в браузере. Многопроходный рендеринг в WebGL

Время на прочтение13 мин
Количество просмотров10K

Каждый, кто сталкивался с трехмерной графикой, рано или поздно открывал документацию на методы отрисовки, которые предполагают несколько проходов рендерера. Такие методы позволяют дополнить картинку красивыми эффектами, вроде свечения ярких пятен (Glow), Ambient occlusion, эффекта глубины резкости.


И «взрослый» OpenGL, и мой любимый WebGL предлагают богатую функциональность для отрисовки результатов в промежуточные текстуры. Однако управление этой функциональностью — довольно сложный процесс, в котором очень легко получить ошибку на любом из этапов, начиная от создания текстур нужного разрешения до именования юниформ и передачи их в соответствующий шейдер.


Чтобы разобраться, как правильно готовить WebGL, мы обратились к специалистам компании Align Technology. Они решили создать специальный менеджер для управления всем этим зоопарком из разных текстур, которым было бы удобно пользоваться. Что из этого получилось — будет под катом. Важно, что неподготовленного читателя, который никогда до этого не сталкивался с необходимостью организации многопроходного рендеринга, статья может показаться непонятной. Задача довольно специфическая, но и безумно интересная.


Читать дальше →
Всего голосов 35: ↑34 и ↓1+33
Комментарии6

Монады с точки зрения теории категорий

Время на прочтение9 мин
Количество просмотров34K

Введение

Кажется, монады в программировании стали загадкой века. И для этого есть две причины:
  • недостаточное знание теории категорий;
  • многие авторы стараюстся не упоминать категории вообще.
Это как говорить об электричестве не используя мат. анализ. Достаточно для замены предохранителя, не хватит, чтобы спроектировать усилитель.

Мы начнём с простого введения в категории и функторы, затем дадим определение монады, приведём простые примеры монад в категориях и в конце приведём монадическую терминологию используемую в языках программирования.

Я уверен, что монады с точки зрения категорий почти элементарны.

Содержание

  1. Категория
  2. Функтор
  3. Естественное преобразование
  4. Монада
  5. Монады исключения и состояния
  6. Монады в программировании
  7. Ссылки
Читать дальше →
Всего голосов 126: ↑105 и ↓21+84
Комментарии150

Функторы, аппликативные функторы и монады в картинках

Время на прочтение5 мин
Количество просмотров190K
Вот некое простое значение:


И мы знаем, как к нему можно применить функцию:


Элементарно. Так что теперь усложним задание — пусть наше значение имеет контекст. Пока что вы можете думать о контексте просто как о ящике, куда можно положить значение:


Теперь, когда вы примените функцию к этому значению, результаты вы будете получать разные — в зависимости от контекста. Это основная идея, на которой базируются функторы, аппликативные функторы, монады, стрелки и т.п. Тип данных Maybe определяет два связанных контекста:


data Maybe a = Nothing | Just a

Позже мы увидим разницу в поведении функции для Just a против Nothing. Но сначала поговорим о функторах!
Читать дальше →
Всего голосов 184: ↑175 и ↓9+166
Комментарии60

Создаём собственный физический 2D-движок: части 2-4

Время на прочтение32 мин
Количество просмотров38K
image


Оглавление


Часть 2: ядро движка

  • Интегрирование
  • Метки времени
  • Модульная архитектура
    • Тела
    • Формы
    • Силы
    • Материалы
  • Широкая фаза
    • Отсечение дубликатов контактных пар
    • Система слоёв
  • Проверка пересечения полупространств

Часть 3: трение, сцена и таблица переходов

  • Трение
  • Сцена
  • Таблица переходов коллизий

Часть 4: ориентированные твёрдые тела

  • Математика вращения
  • Ориентированные формы
  • Распознавание коллизий
  • Разрешение коллизий

Всего голосов 52: ↑51 и ↓1+50
Комментарии8

Прекрасные чудовища математики

Время на прочтение11 мин
Количество просмотров55K
image

UPD: добавлен график функции.

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

В конце концов Вейерштрасс отправил одну из своих статей в уважаемый «Журнал Крелле». Несмотря на то, что предыдущие статьи остались едва замеченными, эта вызвала огромный всплеск интереса. Вейерштрасс обнаружил способ работы с ужасным классом уравнений, известным как «абелевы функции». В статье было приведено краткое изложение его методов, но этого было достаточно, чтобы убедить математиков в наличии у автора уникального таланта. Не прошло и года, как Кёнигсбергский университет дал Вейерштрассу почётную докторскую степень, а вскоре после этого Берлинский университет предложил ему должность профессора. Несмотря на то, что Вейерштрасс проделал интеллектуальный аналог пути «из грязи в князи», многие из его старых привычек сохранились. Он редко публиковал статьи, предпочитая делиться своими работами со студентами. Но он был малопочтителен не только к процессу публикации: не пугали его и «священные коровы» математики.
Читать дальше →
Всего голосов 99: ↑99 и ↓0+99
Комментарии63

Stryker, мутационное тестирование в JavaScript

Время на прочтение6 мин
Количество просмотров9K

Недавно я познакомился с методом тестирования ПО под названием «Мутационное тестирование» и уже успел стать фанатом такого подхода к написанию тестов.


Сначала теория


Цель мутационного тестирования состоит в выявлении неэффективных и неполных тестов, то есть это по сути тестирование тестов.


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

Читать дальше →
Всего голосов 15: ↑15 и ↓0+15
Комментарии4

Веб-приложение на Node и Vue, часть 1: структура проекта, API, аутентификация

Время на прочтение13 мин
Количество просмотров92K
Перед вами — первый материал из серии, посвящённой разработке полноценного веб-приложения, которое называется Budget Manager. Основные программные средства, которые будут использованы в ходе работы над ним — это Node.js для сервера, Vue.js для фронтенда, и MongoDB в роли базы данных.



Эти материалы рассчитаны на читателей, которые знакомы с JavaScript, имеют общее представление о Node.js, npm и MongoDB, и хотят изучить связку Node-Vue-MongoDB и сопутствующие технологии. Приложение будем писать с нуля, поэтому запаситесь любимым редактором кода. Для того, чтобы не усложнять проект, мы не будем пользоваться Vuex и постараемся сосредоточиться на самом главном, не отвлекаясь на второстепенные вещи.

Автор этого материала, разработчик из Бразилии, говорит, что ему далеко до JavaScript-гуру, но он, находясь в поиске новых знаний, готов поделиться с другими тем, что ему удалось найти.
Читать дальше →
Всего голосов 23: ↑22 и ↓1+21
Комментарии3

Весь веб на 60+ FPS: как новый рендерер в Firefox избавился от рывков и подтормаживаний

Время на прочтение16 мин
Количество просмотров67K
До релиза Firefox Quantum остаётся всё меньше времени. Он принесёт множество улучшений в производительности, в том числе сверхбыстрый движок CSS, который мы позаимствовали у Servo.

Но есть ещё одна большая часть технологии Servo, которая пока не вошла в состав Firefox Quantum, но скоро войдёт. Это WebRender, часть проекта Quantum Render.



WebRender известен своей исключительной скоростью. Но главная задача — не ускорить рендеринг, а сделать его более плавным.

При разработке WebRender мы поставили задачу, чтобы все приложения работали на 60 кадрах в секунду (FPS) или лучше, независимо от размера дисплея или от размера анимации. И это сработало. Страницы, которые пыхтят на 15 FPS в Chrome или нынешнем Firefox, летают на 60 FPS при запуске WebRender.

Как WebRender делает это? Он фундаментальным образом меняет принцип работы движка рендеринга, делая его более похожим на движок 3D-игры.
Читать дальше →
Всего голосов 123: ↑121 и ↓2+119
Комментарии95

Пять простых шагов для понимания JSON Web Tokens (JWT)

Время на прочтение5 мин
Количество просмотров620K

jwt


Представляю вам мой довольно вольный перевод статьи 5 Easy Steps to Understanding JSON Web Tokens (JWT). В этой статье будет рассказано о том, что из себя представляют JSON Web Tokens (JWT) и с чем их едят. То есть какую роль они играют в проверке подлинности пользователя и обеспечении безопасности данных приложения.

Читать дальше →
Всего голосов 28: ↑24 и ↓4+20
Комментарии60

V8 под капотом

Время на прочтение14 мин
Количество просмотров32K
Ведущий разработчик Яндекс.Деньги Андрей Мелихов (также редактор/переводчик сообщества devSchacht) на примере движка V8 рассказывает о том, как и через какие стадии проходит программа, прежде чем превращается в машинный код, и зачем на самом деле нужен новый компилятор.



Материал подготовлен на основе доклада автора на конференции HolyJS 2017, которая проходила в Санкт-Петербурге 2-3 июня. Презентацию в pdf можно найти по этой ссылке.
Читать дальше →
Всего голосов 45: ↑44 и ↓1+43
Комментарии8

Как работает видеопроцессор

Время на прочтение29 мин
Количество просмотров71K
image

[Прим. пер.: оригинал статьи называется GPU Performance for Game Artists, но, как мне кажется, она будет полезной для всех, кто хочет иметь общее представление о работе видеопроцессора]

За скорость игры несут ответственность все члены команды, вне зависимости от должности. У нас, 3D-программистов, есть широкие возможности для управления производительностью видеопроцессора: мы можем оптимизировать шейдеры, жертвовать качеством картинки ради скорости, использовать более хитрые техники рендеринга… Однако есть аспект, который мы не можем полностью контролировать, и это графические ресурсы игры.

Мы надеемся, что художники создадут ресурсы, которые не только хорошо выглядят, но и будут эффективны при рендеринге. Если художники немного больше узнают о том, что происходит внутри видеопроцессора, это может оказать большое влияние на частоту кадров игры. Если вы художник и хотите понять, почему для производительности важны такие аспекты, как вызовы отрисовки (draw calls), уровни детализации (LOD) и MIP-текстуры, то прочитайте эту статью. Чтобы учитывать то влияние, которое имеют ваши графические ресурсы на производительность игры, вы должны знать, как полигональные сетки попадают из 3D-редактора на игровой экран. Это значит, что вам нужно понять работу видеопроцессора, микросхемы, управляющей графической картой и несущей ответственность за трёхмерный рендеринг в реальном времени. Вооружённые этим знанием, мы рассмотрим наиболее частые проблемы с производительностью, разберём, почему они являются проблемой, и объясним, как с ними справиться.
Читать дальше →
Всего голосов 54: ↑53 и ↓1+52
Комментарии12

Как работает JS: обзор движка, механизмов времени выполнения, стека вызовов

Время на прочтение6 мин
Количество просмотров203K
Популярность JavaScript растёт, его возможности используют на разных уровнях применяемых разработчиками стеков технологий и на множестве платформ. На JS делают фронтенд и бэкенд, пишут гибридные и встраиваемые приложения, а также многое другое.

Анализ статистики GitHub показывает, что по показателям активных репозиториев и push-запросов, JavaScript находится на первом месте, да и в других категориях он показывает довольно высокие позиции.


Статистические сведения по JavaScript с GitHub

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

Если множество проектов плотно завязаны на JavaScript, значит, разработчикам необходимо как можно более эффективно использовать всё, что даёт им язык и его экосистема, стремясь, на пути разработки замечательных программ, к глубокому пониманию внутренних механизмов языка.

Как ни странно, существует множество разработчиков, которые регулярно пишут на JavaScript, но не знают, что происходит в его недрах. Пришло время это исправить: этот материал посвящён обзору JS-движка на примере V8, механизмов времени выполнения, и стека вызовов.
Читать дальше →
Всего голосов 41: ↑33 и ↓8+25
Комментарии29

Теория категорий для программистов: предисловие

Время на прочтение5 мин
Количество просмотров108K
Вот уже некоторое время я обдумываю идею написать книгу о теории категорий для программистов. Не компьютерных теоретиков, программистов — скорее инженеров, чем ученых. Я знаю, что это звучит безумно, и я сам достаточно напуган. Я знаю, что есть огромная разница между наукой и техникой, потому, что я работал по обе стороны баррикад. Но у меня всегда был очень сильный порыв объяснить вещи. Я восхищаюсь Ричардрм Фейнманом, который был мастером простых объяснений. Я знаю, я не Фейнман, но я буду стараться изо всех сил. Я начинаю с публикации этого предисловия, которое должно мотивировать читателя изучить теорию категорий, и надеюсь на начало дискуссии и обратную связь.

Я постараюсь в нескольких параграфах убедить вас, что эта книга написана для вас, и развеять все ваши сомнения в необходимости изучения этой, одной из самых абстрактных областей математики, в свое драгоценное свободное время.
Читать дальше →
Всего голосов 55: ↑51 и ↓4+47
Комментарии25

Как работает JS: о внутреннем устройстве V8 и оптимизации кода

Время на прочтение11 мин
Количество просмотров158K
[Советуем почитать] Другие 19 частей цикла
Часть 1: Обзор движка, механизмов времени выполнения, стека вызовов
Часть 2: О внутреннем устройстве V8 и оптимизации кода
Часть 3: Управление памятью, четыре вида утечек памяти и борьба с ними
Часть 4: Цикл событий, асинхронность и пять способов улучшения кода с помощью async / await
Часть 5: WebSocket и HTTP/2+SSE. Что выбрать?
Часть 6: Особенности и сфера применения WebAssembly
Часть 7: Веб-воркеры и пять сценариев их использования
Часть 8: Сервис-воркеры
Часть 9: Веб push-уведомления
Часть 10: Отслеживание изменений в DOM с помощью MutationObserver
Часть 11: Движки рендеринга веб-страниц и советы по оптимизации их производительности
Часть 12: Сетевая подсистема браузеров, оптимизация её производительности и безопасности
Часть 12: Сетевая подсистема браузеров, оптимизация её производительности и безопасности
Часть 13: Анимация средствами CSS и JavaScript
Часть 14: Как работает JS: абстрактные синтаксические деревья, парсинг и его оптимизация
Часть 15: Как работает JS: классы и наследование, транспиляция в Babel и TypeScript
Часть 16: Как работает JS: системы хранения данных
Часть 17: Как работает JS: технология Shadow DOM и веб-компоненты
Часть 18: Как работает JS: WebRTC и механизмы P2P-коммуникаций
Часть 19: Как работает JS: пользовательские элементы

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


Читать дальше →
Всего голосов 34: ↑34 и ↓0+34
Комментарии9

Информация

В рейтинге
Не участвует
Откуда
Воронеж, Воронежская обл., Россия
Дата рождения
Зарегистрирован
Активность