Как стать автором
Обновить
18
0
Маров Николай @kolyuchii

Пользователь

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

Сниппеты для Chrome DevTools

Время на прочтение5 мин
Количество просмотров32K
Возможности встроенного в браузер инструмента Chrome Developer Tools можно расширить с помощью сниппетов. Это ускоряет разработку и упрощает рабочий процесс. Хорошая коллекция сниппетов есть на GitHub'е.

Сниппеты в Google Chrome


Подробно о функциях сниппетов можно почитать в официальной документации Chrome. А вот краткая инструкция:

  1. Зайти в «chrome://flags» — Отметить «Enable Developer Tools experiments».
  2. Открыть DevTools: «Settings» — «Developer Tools Experiments» — Отметить «Snippets support».
  3. После перезагрузки во вкладке DevTools «Sources» появится «Snippets», где можно управлять сниппетами:

image
Читать дальше →
Всего голосов 51: ↑49 и ↓2+47
Комментарии13

Эволюция разработки в Badoo

Время на прочтение1 мин
Количество просмотров19K
Как устроен процесс организации разработки в крупном интернет-проекте на всех этапах его роста? Что происходит, когда из стартапа компания перерастает в проект с более чем 190 миллионами пользователей.

В прошлом году на конференции Whalerider Алексей fisher Рыбак рассказывал о том:

  • как у нас Badoo сейчас устроена разработка;
  • как в процессе развития проекта её перестраивали;
  • какие проблемы решали;
  • как преодолевали кризисы роста;
  • на какие грабли наступали.

В секции вопросов есть интересная информация о том, как в Badoo устроена система мотивации и бонусов.
Сейчас у нас появилось видео и мы хотим поделиться им с вами.



Всего голосов 73: ↑64 и ↓9+55
Комментарии18

Пишем быстрый и экономный код на JavaScript

Время на прочтение16 мин
Количество просмотров69K
Такой движок JS, как V8 (Chrome, Node) от Google, заточен для быстрого исполнения больших приложений. Если вы во время разработки заботитесь об эффективном использовании памяти и быстродействии, вам необходимо знать кое-что о процессах, проходящих в движке JS браузера.

Что бы там ни было — V8, SpiderMonkey (Firefox), Carakan (Opera), Chakra (IE) или что-то ещё, знание внутренних процессов поможет вам оптимизировать работу ваших приложений. Но не призываю вас оптимизировать движок для одного браузера или движка – не делайте так.

Задайте себе вопрос:
— можно ли что-то в моём коде сделать более эффективным?
— какую оптимизацию проводят популярные движки JS?
— что движок не может компенсировать, и может ли сборка мусора подчистить всё так, как я от неё ожидаю?



Есть много ловушек, связанных с эффективным использованием памяти и быстродействием, и в статье мы изучим некоторые подходы, которые хорошо показали себя в тестах.
Читать дальше →
Всего голосов 78: ↑72 и ↓6+66
Комментарии29

Основной цикл в Javascript

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


Все мы слышали про ajax и node.js. Они прочно обосновались уже не просто в словарном запасе, но и в наборе инструментов веб-разработчика. Ajax — асинхронное подтягивание данных с сервера на страницу, node — фреймворк с асинхронным IO. Но как в таком однопоточном языке, как Javascript, реализуется та самая асинхронность?

Вы, наверное, уже догадались из заголовка, речь пойдет об основном цикле («main loop»).
Читать дальше →
Всего голосов 190: ↑186 и ↓4+182
Комментарии41

Range, TextRange и Selection

Время на прочтение13 мин
Количество просмотров78K
Многим JavaScript-разработчикам приходилось сталкиваться с объектами, перечисленными в заголовке, например, при решении следующих задач:
— создание визуальных редакторов (wysiwyg),
— поиск в окне браузера,
— выставление BB-кода,
и т.д.

В этой статье автором предпринята попытка собрать перевод документации об этих объектах в одном месте + написать небольшие сопроводительные примеры. Перевод вольный, не дословный, так что если встретите неточность или корявую формулировку — пишите в комментариях.

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

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

Размеры экранов

Время на прочтение2 мин
Количество просмотров552K
Планшеты и смартфоны оснащаются экранами с разными соотношениями сторон и разной плотностью пикселей, однако эти параметры редко указываются в технических характеристиках.

Попробуем разобраться со всеми хитростями, связанными с этими параметрами. Начнём с планшетов.
Вот соотношение размеров экранов, использующихся в большинстве современных планшетов.



Обратите внимание, насколько экран 8" с соотношением сторон 4:3 визуально больше широкого экрана 7". А широкий экран 10.1" на сантиметр меньше экрана 9.7" по высоте.

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



Текст на экранах с низким PPI (количеством точек на дюйм) читается не комфортно. Я бы не стал покупать планшет с экраном, имеющим PPI ниже 150. Даже 164 PPI экрана iPad mini многим кажутся недостаточными. Отлично воспринимаются экраны с PPI больше 200.

Для меня было большим открытием, что экран 9.7" 1024x768 имеет даже меньшее PPI, чем экран 7" 800x480.

Читать дальше →
Всего голосов 157: ↑147 и ↓10+137
Комментарии69

You are the CSS to my HTML

Время на прочтение1 мин
Количество просмотров4K
Всем добрый день!

Как выразить чувства «компьютерщику»? Пожалуй, так:



Фраза, понятная не всем, но «знающие» оценят сколько души вложено в эти слова :-)
Всего голосов 188: ↑144 и ↓44+100
Комментарии80

Алгоритмы поиска путей на JavaScript

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


Поиск оптимального маршрута юнита к цели на неизвестной карте — одна из самых сложных задач при разработке игры. К счастью, существует некоторое количество алгоритмов, которые решают эту задачу. Есть и отличная библиотека PathFinding.js с поддержкой 11 таких алгоритмов.
Читать дальше →
Всего голосов 65: ↑47 и ↓18+29
Комментарии14

Дайджест интересных материалов из мира веб-разработки и IT за последнюю неделю №126 (15 — 21 сентября 2014)

Время на прочтение5 мин
Количество просмотров34K
Предлагаем вашему вниманию подборку с ссылками на полезные ресурсы, интересные материалы и IT-новости


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

Асинхронный JavaScript: без колбеков и промисов

Время на прочтение7 мин
Количество просмотров42K
Наверное, каждый, кто использовал JavaScript, когда-либо сталкивался (или столкнётся в будущем) с асинхронными вызовами. Может быть, это будет обращение к базе на стороне сервера. Может быть — работа с таймером для создания анимации на сайте.

Для того, чтобы «побороть» асинхронность, используются разные инструменты от промисов до смены языка программирования. Но иногда очень хочется бросить всё и написать на чистом JS линейный код:

timeout(1000);
console.log('Hello, world!');


Можно ли реализовать нечто подобное? Разумеется, можно.
В данной статье мы рассмотрим один опасный, но действенный способ.
Читать дальше →
Всего голосов 70: ↑57 и ↓13+44
Комментарии32

Революция дата-байндинга с Object.Observe()

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

Введение


Грядет революция. Появилось новое дополнение к JavaScript, которое изменит всё, что вы когда-либо знали о дата-байндинге. Помимо этого, изменится и подход ваших MVC библиотек к наблюдениям за редактированием и обновлением моделей. Вы готовы?

Хорошо, хорошо. Не будем тянуть. Я рад вам представить Object.observe(), который появился в бета версии Chrome 36. [ТОЛПА ЛИКУЕТ]

Object.observe() является частью следующего ECMAScript стандарта. Он позволяет асинхронно отслеживать изменения JavaScript объектов… без использования каких-либо сторонних библиотек, он позволяет наблюдателю отслеживать изменения состояния объекта во времени.
Читать дальше →
Всего голосов 65: ↑57 и ↓8+49
Комментарии48

Функциональный JavaScript, Часть 1: Введение

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

Введение


JavaScript мощный, но недопонятый язык программирования. Людям нравится говорить, что он является объектно-ориентированным языком программирования или является функциональным языком. Другим нравится говорить, что он не является объектно ориентированным или не является функциональным языком программирования. Некоторые скажут что он относится к обеим парадигмам или ни к одной из них — но, давайте отложим на пока этот спор в сторонку.
Читать дальше →
Всего голосов 48: ↑37 и ↓11+26
Комментарии15

Функциональный Javascript. Пишем свои линзы, часть 1

Время на прочтение7 мин
Количество просмотров28K
Привет, хабр.
В данной статье мы познакомимся с линзами, узнаем для чего они нужны, а также реализуем их на JavaScript.

Зачем нужны линзы


Начнем, пожалуй, с ответа на вопрос, зачем же нужны линзы.

В функциональном программировании широко используются неизменяемые структуры данных. Работа с ними значительно отличается по сравнению с изменяемыми данными.

В основе этого лежит тот факт, что при изменении какой-либо части неизменяемой структуры данных создается ее копия, отличающаяся от оригинала этой самой измененной частью. Полное копирование всей исходной структуры не эффективно, поэтому новая структура как правило использует ссылки на неизмененные части из оригинала.
Читать дальше →
Всего голосов 53: ↑48 и ↓5+43
Комментарии42

Линейная алгебра для разработчиков игр

Время на прочтение19 мин
Количество просмотров771K
Эта статья является переводом цикла из четырёх статей «Linear algebra for game developers», написанных David Rosen и посвящённых линейной алгебре и её применению в разработке игр. С оригинальными статьями можно ознакомиться тут: часть 1, часть 2, часть 3 и часть 4. Я не стал публиковать переводы отдельными топиками, а объединил все статьи в одну. Думаю, что так будет удобнее воспринимать материал и работать с ним. Итак приступим.
Читать дальше →
Всего голосов 314: ↑296 и ↓18+278
Комментарии61

Продвинутые анимации с requestAnimationFrame

Время на прочтение3 мин
Количество просмотров68K
Если вы никогда не писали код для выполнения анимаций, то вы можете дальше не читать :)

Что такое requestAnimationFrame?


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

Зачем я должен это использовать?


Браузеры могут оптимизировать анимации идущие одновременно, уменьшив число reflow и repaint до одного, что в свою очередь приведет к повышению точности анимации. Например анимации на JavaScript синхронизированные с CSS transitions или SVG SMIL. Плюс ко всему если выполняется анимация в табе, который невидим, браузеры не будут продолжать перерисовку, что приведет к меньшему использованию CPU, GPU, памяти и как следствие снизит расход батареи в мобильных устройствах.
Читать дальше →
Всего голосов 27: ↑25 и ↓2+23
Комментарии36

CSS 3 Timing Functions и с чем их едят

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


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


Окей, ваша кровь, конечно, вряд ли закипела от предмета данной статьи, но шутки в сторону: временные функции — своего рода скрытая жемчужина, когда дело касается CSS, и, вполне вероятно, вы удивитесь тому, сколько всего интересного с помощью них можно сделать.

Полетели!
Всего голосов 77: ↑74 и ↓3+71
Комментарии8

Martin Fowler — GUI Architectures. Часть 2

Время на прочтение9 мин
Количество просмотров30K
Всем привет еще раз. Это опять я. Внутри хабраката перевод еще одного параграфа статьи Мартина Фаулера.

На этот раз затронута тема MVC. Фаулер весьма популярно про него написал. Я постарался популярно перевести:) Теперь можно понять, почему все носятся с MVC, как с писанной торбой. И, кстати, Фаулер прав — очень много где и много кто воспринимают MVC по-своему. Сам Фаулер пишет про оригинальный MVC, который работал на платформе Smalltalk. Очень познавательно.

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

Следующую часть перевода напишу, когда разозлюсь и возьму себя в руки.
Прочитать про MVC.
Всего голосов 17: ↑16 и ↓1+15
Комментарии19

JSDuck — генератор документации

Время на прочтение6 мин
Количество просмотров20K
Документирование является неотъемлемой частью хорошего кода и проекта в целом. Хорошие разработчики тратят много времени на поддержку документации, но в дальнейшем это окупается с лихвой: экономит время на поддержке кода, его расширении и исправлении багов, позволяет сократить время на погружение в проект новых разработчиков и т.д. Так же, хорошо документированный код неявно стимулирует разработчика к применению стандартов кодирования.
Читать дальше →
Всего голосов 18: ↑18 и ↓0+18
Комментарии4

PhpStorm — повышаем производительность (клавиатурные сокращения). Часть 1

Время на прочтение4 мин
Количество просмотров209K
imagePhpStorm — повышаем производительность (плагины и темы оформления). Часть 2

У всех нас есть любимые IDE или редакторы в которых мы пишем код. Для меня это PhpStorm, и потребовалось некоторое время, чтобы освоить все клавиатурные сокращения и ускорить свой рабочий процесс. В этой статье я поделюсь с вами некоторыми сочетания клавиш и советами, которые возьмут на себя часть рутинной работы, если вы тоже делаете свою работу в этой IDE. Эта статья была частично вдохновлена этим Reddit тредом, и я буду упомянать и демонстрировать некоторые трюки найденные там.

Обратите внимание, что я разрабатываю на Linux в Vagrant, размещенном в Windows, я буду использовать клавишу CTRL вместо CMD. Если вы работаете в OS X, замените CTRL на CMD.

Клавиатурные сокращения и хаки


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

(осторожно, много gif изображений)
Давайте посмотрим, чем мы можем воспользоваться
Всего голосов 77: ↑68 и ↓9+59
Комментарии58

CMS будущего

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

Покончим с устаревшим подходом к контенту


На протяжении всей истории интернета мы работали с контентом двумя способами:
  1. Создавали «один шаблон на все случаи жизни»
  2. Создавали для каждого случая свой уникальный шаблон

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

image
Читать дальше →
Всего голосов 68: ↑58 и ↓10+48
Комментарии73
1
23 ...

Информация

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