Pull to refresh
133
0
Зубашев Степан @faiwer

frontend-программист

Обращение к Javascript-сообществу: перестаньте писать квадраты

Reading time 7 min
Views 66K

Пост про то, почему стоит, как минимум избегать квадратичной сложности в тех местах, где на это нет никаких причин. Если вы широко используете .concat в .reduce эта статья для вас. В ней я попытаюсь разобрать на пальцах почему это может быть очень плохим решением, и как это исправить.

Read more
Total votes 216: ↑213 and ↓3 +210
Comments 355

Chrome DevTools: Хитрости при отладке

Reading time 7 min
Views 44K

В сети полно обзоров Chrome DevTools, которые демонстрируют многочисленные возможности этого прекрасного инструмента. DevTools настолько большие, что познать их полностью, как мне кажется, уже почти невозможно.

В этой заметке я бы хотел остановиться на различных нюансах, полезных при отладке. Какие-то из них я почерпнул в сети (например в комментариях на Хабре), до каких-то додумался сам. Надеюсь вы найдёте для себя что-нибудь полезное.

Под катом:

— Как отладить popup-ы, которые исчезают при потере фокуса
— Как убить повисший JS-цикл, не убивая вкладку
— Различные нюансы работы с breakpoint-ми
— Методы ведения войны с sourceMaps
— Перехват network-запросов
— Как отладить race-condition
— Почему стоит опасаться галочки "disable cache"
— Что делать если у вас не Hi-DPI экран?

Подробнее
Total votes 50: ↑49 and ↓1 +48
Comments 41

Typescript: Объединение типов в глубину

Reading time 6 min
Views 25K

Пошаговое руководство о том, как в TypeScript написать такой generic-тип, который рекурсивно объединяет произвольные вложенные key-value структуры данных. Это может оказаться несколько более сложной задачей, чем вы думаете.

Подробнее
Total votes 13: ↑13 and ↓0 +13
Comments 28

Пасхальные яйца и Open Source

Reading time 2 min
Views 5.4K
«Пасхальное яйцо» (англ. Easter Egg) — секрет в компьютерной игре, фильме или программном обеспечении, заложенный создателями. Отличие пасхального яйца в игре от обычного игрового секрета состоит в том, что его содержание, как правило, не вписывается в общую концепцию, выглядит в контексте неправдоподобно, нелепо, и зачастую является внешней ссылкой. Пасхальные яйца играют роль своеобразных шуток для внимательных игроков или зрителей. (wiki)

Пасхальные яйца бывают разные. Например широко известна команда apt-get moo, которая рисует корову в консоли:


         (__) 
         (oo) 
   /------\/ 
  / |    ||   
 *  /\---/\ 
    ~~   ~~   
...."Have you mooed today?"...

Пожалуй все согласятся с тем, что apt-get moo не является деструктивной функцией. Эта пасхалка может показаться смешной, или же нет, а то и вовсе неуместной, но она наверняка вам ничего не сломает. Также можно посмотреть некоторые другие пасхалки в linux.


В этой статье я бы хотел остановиться на одной конкретной пасхалке. А конкретно о "christmas" в ant-design. Это неплохая UI библиотека контролов для React-экосистемы. Про неё можно было бы написать отдельную статью, но сейчас не об этом.

Читать дальше →
Total votes 13: ↑12 and ↓1 +11
Comments 10

Разбор пазла с регулярными выражениями от Linkedin

Reading time 3 min
Views 8K
Все мы с детства знаем о кроссвордах. Их разновидностей человечество напридумывало довольно много. И одна из таких разновидностей подразумевает использование регулярных выражений, вместо вопросов на эрудицию. Ссылка на один из таких кроссвордов попала мне в руки, и я с энтузиазмом принялся его разгадывать.

кроссворд

В этой заметке я бы хотел разобрать данный кроссворд по пунктам. Статья может быть полезна тем, кто уже знаком и использует в деле регулярные выражения, но испытывает проблемы с нетривиальными задачами. В любом случае, я рекомендую попробовать его пройти самостоятельно, т.к. он не сложный. Ну а если такие вещи, как негативная ретроспективная проверка, часть вашего рабочего арсенала, то ничего нового вы в статье не найдёте.
Читать дальше →
Total votes 18: ↑13 and ↓5 +8
Comments 4

Пишем плагин для CKEditor 4

Reading time 8 min
Views 24K
CKEditor — это WYSIWYG редактор HTML-кода для браузеров. Всякий раз, сталкиваясь с его документацией или же с его исходным кодом, с исходным кодом его плагинов я терялся. И это не мудрено, ведь CKEditor это очень большой продукт, имеющий довольно сложную инфраструктуру. Но, зачастую, стандартных возможностей не хватает и требуется добавить свою. В этой статье я хотел бы остановиться на плагине, который позволяет встраивать и оперировать в редакторе Yandex-картами.

Вот так это будет выглядеть по окончанию редактирования:


А вот так в режиме редактирования:
Читать дальше →
Total votes 19: ↑19 and ↓0 +19
Comments 19

Sublime Text 2

Reading time 12 min
Views 306K
Пару месяцев назад я случайно наткнулся на массу положительных отзывов о текстовом редакторе Sublime Text 2. Попробовав его в деле, я не разочаровался. Теперь это мой основной рабочий инструмент.

Sublime Text 2 — это платный текстовый редактор, написанный на C++, который:

  • Работает в Linux, OS X и Windows
  • Обладает приличной скоростью работы
  • Приятным интерфейсом (включая всевозможные анимации)
  • Гибко настраиваем (правда, не в GUI, а в json-конфигах)
  • Имеет множество плагинов, число которых растёт как на дрожжах
  • Поддерживает VIM-режим
  • Использует fuzzy-поиск
Читать дальше →
Total votes 235: ↑207.5 and ↓27.5 +180
Comments 284

Пишем простое Opera-расширение

Reading time 7 min
Views 22K
Эта статья посвящена написанию простого расширения для браузера Opera. Наше расширение будет примитивным, т.к. весь его функционал будет заключаться в user-JS для habrahabr.ru. Лента комментариев оснащена блоком, который отображает количество новых комментариев в топику и кнопку, позволяющую эту ленту обновить. Давайте добавим туда стрелки для навигации по новым комментариям.

Читать дальше →
Total votes 45: ↑38 and ↓7 +31
Comments 12

SCSS — немного практики, часть I

Reading time 5 min
Views 529K

image


Статей про SASS(SCSS), Less на хабрахабре уже полно, но на мой взгляд не хватает такой, в которой было бы немного реальной практики. Я постараюсь восполнить этот пробел. Около года назад одна из SASS-статей меня "зацепила", и с тех пор я полюбил эту технологию настолько, что ручной набор обычного CSS кода представляется мне лишней тратой времени. Сия статья посвящается тем верстальщикам (или web-программистам), которые про SCSS ещё не слышали, или же ещё не пробовали в деле. Более опытным товарищам, полагаю, в ней ловить нечего.


Что такое SCSS


SCSS — "диалект" языка SASS. А что такое SASS? SASS это язык похожий на HAML (весьма лаконичный шаблонизатор), но предназначенный для упрощения создания CSS-кода. Проще говоря, SASS это такой язык, код которого специальной ruby-программой транслируется в обычный CSS код. Синтаксис этого языка очень гибок, он учитывает множество мелочей, которые так желанны в CSS. Более того, в нём есть даже логика (@if, each), математика (можно складывать как числа, строки, так и цвета). Возможно, некоторые возможности SCSS покажутся вам избыточными, но, на мой взгляд, лишними они не будут, останутся "про запас".

Читать дальше →
Total votes 45: ↑38 and ↓7 +31
Comments 24

Объединение javascript файлов

Reading time 4 min
Views 39K
Эпоха тёплого лампового WEB 1.0 давно прошла, и в последнее время мы имеем дело со страницами, которые кишат так называемой динамичностью. Динамичность может быть обеспечена при помощи JavaScript, VbScript и плагинами вроде Java, Flash, Silverlight. В этой статье я хочу затронуть одну из возможных оптимизаций web-сайта — объединение всех javascript файлов в один.

Зачем?


Основных причин две:
  1. Повышение скорости загрузки страницы.
  2. Снижение нагрузки на сервер.

Начнём с «повышения скорости загрузки». Зачастую web-сайт просто пестрит скриптами и их общее число может перевалить за 50. Впрочем, это уже будет «клинический случай». Но хотя бы 15-30 встречается регулярно. На каждый чихскрипт браузер посылает запрос и, в зависимости от ответа, либо грузит его полностью, либо забирает из кеша. 15 запросов это много. На это нужно время. Да, все современные браузеры загружают файлы параллельно, но это не повод их так эксплуатировать. В моём случае скорость загрузки страницы возросла в несколько раз.

Касательно снижения нагрузки на сервер — всё сложнее. Снижение числа запросов в любом случае улучшает ситуацию, но вот насколько — я сказать затрудняюсь, т.к. я не админ. Я полагаю, что для снижения нагрузки можно найти массу более простых и действенных решений. Возможно, это, так называемая, экономия спичек на фоне пожара. Но в качестве побочного эффекта — сгодится.
Читать дальше →
Total votes 40: ↑31 and ↓9 +22
Comments 39

Information

Rating
Does not participate
Location
Алматы (Алма-Ата), Алма-Атинская обл., Казахстан
Date of birth
Registered
Activity