Pull to refresh
17
0
Sergey @NaN

web dev

Send message

Сделаем худший Vue.js в мире

Reading time 5 min
Views 16K
Некоторое время назад я опубликовал похожую статью про React, где с помощью пары строк кода мы создали крошечный клон React.js с нуля. Но React — далеко не единственный инструмент в современном фронтенд-мире, Vue.js стремительно набирает популярность. Давайте разберемся, как работает этот фреймворк, и создадим примитивный клон, похожий на Vue.js, в образовательных целях.

Реактивность


Как и React.js, Vue является реактивным, то есть все изменения в состоянии приложения автоматически отражаются в DOM. Но в отличие от React, Vue отслеживает зависимости во время рендеринга и обновляет только связанные части без каких-либо «сравнений».

Ключ к реактивности Vue.js — это метод Object.defineProperty. Он позволяет указывать настраиваемый метод getter / setter для поля объекта и перехватывать каждый доступ к нему:
Читать дальше →
Total votes 32: ↑31 and ↓1 +30
Comments 4

Плюшки с изюминкой: как мы используем митапы, преподавание и творчество для мотивации разработчиков

Reading time 3 min
Views 4.3K
image

Программисты привыкли, что у айтишников крутые офисы, хорошие зарплаты и полный соцпакет. Это стало стандартом. Мы в Тензоре не останавливаемся на этом, и чтобы разрабы не заскучали, а новые к нам хотели, применяем и необычные методы мотивации. Какие — расскажут сами программисты.
Total votes 13: ↑11 and ↓2 +9
Comments 1

Ищем причины тормозов БД, используя sys schema в MySQL 5.7

Reading time 3 min
Views 14K
Есть у нас веб-приложение. Относительно большое и старое — много-много кода, в котором много-много разных запросов к базе данных. При этом мы не гугл, но несколько тысяч запросов в секунду на сервер БД приходится.

Ну и безусловно растёт наше приложение во все стороны — добавляются новые фичи, наворачиваются и усложняются старые, растёт количество клиентов и соответственно количество данных в БД. И в один не очень прекрасный момент приходит понимание, что что-то наше приложение тормозит. А значит надо или найти, что именно нагружает БД, хотя могло бы не нагружать, ну или если ничего такого нет, то взять ещё серверов побольше, да помощнее.

Стандартный совет как найти, что нагружает MySQL — включить slow-query-log и посмотреть, какие запросы будут туда попадать. Но в MySQL 5.7 по умолчанию присутствует куда лучший инструмент — sys schema, которая агрегирует данные из performance schema и позволяет их получить простыми запросами, буквально вида «Ok, MySQL, покажи мне топ запросов по максимальному суммарному времени выполнения»
Читать дальше →
Total votes 26: ↑26 and ↓0 +26
Comments 3

Заблуждения программистов о телефонных номерах

Reading time 3 min
Views 62K
Список составили разработчики Java, C++ и JavaScript библиотеки libphonenumber для парсинга, форматирования и проверки телефонных номеров

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

1. Телефонные номера, действительные сейчас, останутся действительными всегда. Телефонные номера определённого типа (например, мобильные), никогда не сменят тип.

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

Подсказка. Не сохраняйте свойства телефонного номера, такие как валидность или тип. Проверяйте эту информацию с помощью библиотеки, когда необходимо.
Читать дальше →
Total votes 35: ↑30 and ↓5 +25
Comments 24

(Не)безопасный frontend

Reading time 13 min
Views 60K

Интро


Не так давно я выступал на конференции FrontendConf 2015 (РИТ++) с темой данной статьи. И при подготовке доклада начал искать информацию, а кто вообще выступал на данную тему и что есть в Сети на данный момент.

Оказалось, что информации совсем немного, более-менее можно было бы отметить доклад mikewest.org/2013/09/frontend-security-frontendconf-2013 от Mike West из компании Google, но какой-то «непентестерский» взгляд и уж совсем мало материала. И www.slideshare.net/eoftedal/web-application-security-in-front-end где тема раскрыта более детально, но выступление 2011 года. А за 4 года технологии и атаки на месте не стояли.

Долго и сложно выбирая темы, что же все-таки рассказать разработчикам фронтендов про безопасность, при этом минимум касаясь бекэнда (местами все-таки это неделимо), получился доклад, а здесь — его текстовый пересказ.

О чем вообще разговор?


А действительно, о чем тут вообще можно разговаривать? Говоря про взломы и безопасность невольно приходят в голову тезисы — слили базу, получили доступ к выполнению команд ОС на сервере, прочитали чужую переписку. Но это все — server side код. А что ж может «нагородить» фронтэндер? Главная опасность, конечно же, в обходе атакующим SOP — Same Origin Policy, главной политики безопасности браузеров, которая регулирует работу в разных Origin. Но не только, давайте разбираться.

Читать дальше →
Total votes 64: ↑63 and ↓1 +62
Comments 4

Избавляемся от JavaScript в социальных кнопках (Facebook, VK, Twitter и др.)

Reading time 5 min
Views 78K
Как мы избавились от JavaScript-библиотек социальных сетей, ускорили скорость загрузки страниц и использовали RESTful API для “шаринга” и “лайков”.


Читать дальше →
Total votes 78: ↑73 and ↓5 +68
Comments 44

Elastic Search в enterprise-проектах

Reading time 5 min
Views 55K
В рамках этой статьи я поделюсь опытом использования Elastic Search во внутренних продуктах 2ГИС, в частности, в собственной системе для организации Call-центра. А также расскажу, какие проблемы мы смогли решить, используя этот поисковый движок.


Читать дальше →
Total votes 51: ↑50 and ↓1 +49
Comments 23

Техническая сторона Supl.biz

Reading time 3 min
Views 15K
Добрый день. Меня зовут Алексей Красноперов и я являюсь основателем и техническим директором проекта Supl.biz — торговой площадки для малого и среднего бизнеса. Хочу рассказать, как устроен проект изнутри.

Общая архитектура проекта


Техническая сторона Supl.biz
Читать дальше →
Total votes 25: ↑19 and ↓6 +13
Comments 30

Яндекс не индексирует изображения с сайтов под https

Reading time 1 min
Views 53K
Я бы хотел просто оставить тут небезызвестную картинку с .jpg на конце.

Я не мог этого предполагать, когда принимал решение запустить сайт под Extended Validation SSL.

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

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

Читать дальше →
Total votes 181: ↑121 and ↓60 +61
Comments 48

Почему онлайн консультант не приносит денег, а только портит мой сайт

Reading time 5 min
Views 31K
Многие из нас знают, что такое онлайн-консультант для сайта. Недовольных работой таких систем тьма. Поговорим о том, почему они плохо работают на нас и что нам с этим можно сделать.

Не работают они, потому что (один пункт или комбинация из этого списка):
  1. Мы не умеем ими пользоваться и, соответственно, пользуемся ими не правильно.
  2. Мы не умеем разговаривать и, соответственно, делаем это ужасно.
  3. Мы не дисциплинированы и, соответственно, см. п.2
  4. Мы бы рады пользоваться и разговаривать правильно, но эта чертова поделка только делает вид, что работает и что в ней есть нужные нам функции.
С 4-м пунктом, боюсь, мы ничего сделать не можем, кроме как пойти и найти что-нибудь человеческое. А над остальными, пожалуй, поразмышляем.

Что такое система онлайн консультирования? — Это чат с посетителями сайта в режиме реального времени. Это инструмент продаж. И, самое важное – это часть вашего сайта. Именно это и отличает подобную штуку от Skype, ICQ, ….

Минутку! Мой сайт не интернет магазин. Какие через него продажи? — Но ведь у вас реальный бизнес и зачем то ему понадобился сайт. Попробуйте убедить меня в том, что не для повышения продаж.

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

Автоматическое определение пола по имени

Reading time 3 min
Views 23K
Продолжая рассказывать о технологиях, которые используются в нашем сервисе email-маркетинга Pechkin-mail.ru, мы просто обязаны упомянуть об автоматическом определении пола подписчика по имени. Еще в 2007 году, разрабатывая сервис sms-рассылок, мы очень хотели реализовать возможность автоматического подставления окончаний в прилагательные “Уважаемый”, “Дорогой” и так далее. Обычно такая подстановка осуществляется на основании дополнительного поля в адресной базе клиента. Однако, как нам кажется, это полный отстой.
На это есть 3 причины:
  1. заставлять подписчика задавать свой пол глупо (чем больше полей в форме, тем ниже вероятность ее заполнения)
  2. определять вручную — долго, а значит дорого
  3. от ошибок человек не застрахован ровно так же, как и машина.


Но мы не лингвисты, поэтому реализовать такой модуль было бы слишком сложно для нас, да и функция “не первой необходимости”. Но недавно, работая над склонениями текстов бесконечных актов, договоров и прочих юридических документов, мы вспомнили об используемом нами уже 2 года сервисе Морфер. Это прекрасный лингвистический сервис, специализирующийся на русском языке и позволяющий склонять по падежам слова, целые предложения, числительные, а также получать текст из цифр. В общем, потрясающая разработка всего одного человека — Сергея Слепова.
Подробнее о реализации функции определения пола на нашем сервисе
Total votes 52: ↑30 and ↓22 +8
Comments 47

Проектирование интернет-магазина: личный кабинет, корзина, доставка-оплата, рассылка и другое

Reading time 16 min
Views 147K
Очередная статья большого обзора функционала интернет-магазинов. Сегодня я расскажу про личный кабинет, избранное, интеграцию с социальными сетями, корзину, доставку-оплату, рассылку и уведомления. Всего, вместе с этой частью статьи, я рассмотрел около 50 модулей современных интернет-магазинов.

Прошлые статьи серии можно найти тут:


«Серьезное проектирование серьезного магазина. Часть 1. Исследования»
«Серьезное проектирование серьезного магазина. Часть 2. Модули интернет-магазина»
«Серьезное проектирование серьезного магазина. Часть 3. Карточка товара и не только»
«Серьезное проектирование серьезного магазина. Часть 4. Субституты, комплементы, сравнение и другие инструменты увеличения конверсии»

Регистрация / личный кабинет


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

Сама регистрация должна быть очень простой, чтобы не стать барьером для пользователя, а интернет-магазин должен стимулировать пользователей зарегистрироваться. Некоторые крупные интернет-магазины запрещают совершать покупки незарегистрированным пользователям – это довольно спорный способ заставить зарегистрироваться, но он показывает важность регистрации на сайте. Мотивация зарегистрироваться может быть самой разной: специальная скидка для зарегистрированных пользователей, доступ к любым акциям только для зарегистрированных, особые условия зарегистрированным и т.д.

Рис. 1. Личный кабинет.

image

Читать дальше →
Total votes 32: ↑28 and ↓4 +24
Comments 22

Быстрое веб-приложение — трепанация сети

Reading time 10 min
Views 32K
Психология — интересная и иногда полезная наука. Многочисленные исследования показывают, что задержка в отображении веб-страницы дольше 300 мс заставляет пользователя отвлечься от веб-ресурса и задуматься: «что за хрень?». Поэтому УСКОРИВ веб-проект до психологически невоспринимаемых значений, можно ПРОСТО удерживать пользователей дольше. И именно поэтому бизнес готов тратиться на скорость: $80М — чтобы уменьшить latenсy всего на 1 мс.



Однако, чтобы ускорить современный веб-проект, придется кровушки пустить и основательно покопаться в этой теме — поэтому базовое знание сетевых протоколов приветствуется. Зная принципы, можно без особых усилий ускорить свою веб-систему на сотни миллисекунд всего за несколько подходов. Ну что, готовы сэкономить сотни миллионов? Наливайте кофе.
Читать дальше →
Total votes 83: ↑66 and ↓17 +49
Comments 42

Почему иконки чаще мешают удобству, хотя и выглядят красиво

Reading time 2 min
Views 31K
Только что посмотрел прекрасный ролик, в котором показан ответ на вопрос из известного вирусного клипа «Какие-то люди и Эксперт» (про семь красных перпендикулярных линий).

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

Проблема достаточно простая. Кто не хочет читать — посмотрите быстрый разбор нововведения на Ютубе, а также пример с иконками без надписей и с ними (и убедитесь в заголовке поста), а так прошу под кат.
Читать дальше →
Total votes 73: ↑56 and ↓17 +39
Comments 81

Canary: умная система безопасности для дома

Reading time 3 min
Views 25K


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

Система Canary выделяется из ряда себе подобных, в первую очередь тем, что ее действительно можно назвать «умной» — реагирует она не только на разного рода события, типа открытие/закрытие дверей, но и на необычные сигналы, например, необычное время открытия двери в квартиру.

Читать дальше →
Total votes 37: ↑30 and ↓7 +23
Comments 32

Браузерный мультиплеер без сервера

Reading time 3 min
Views 20K

Про технологию WebRTC в последнее время пишут много. Она позволяет обеспечить взаимодействие двух клиентов без специализированного сервера между ними, но нужда в сервере отпадает только после установки соединения. А на этапе установки самого соединения некоторые серверные ресурсы все еще нужны. Можно ли избавиться от потребности в сервере? Небольшой эксперимент в этом направлении под катом.
Читать дальше →
Total votes 31: ↑25 and ↓6 +19
Comments 23

DDoS любого сайта с использованием заметок Facebook

Reading time 1 min
Views 52K
Полтора месяца назад, chr13 обнаружил способ произвести DDoS любого сайта с помощью Google Spreadsheet, а теперь же он применил такой способ в Facebook Notes. И он сработал!

Способ эксплуатации совершенно такой же, как и в Google Spreadsheet:
  1. Сделайте список «уникальных» «картинок»
    <img src=http://targetname/file?r=1></img>
    <img src=http://targetname/file?r=2></img>
    ...
    <img src=http://targetname/file?r=1000></img>
  2. Создайте заметку через m.facebook.com. Сервис обрежет заметку после какой-то фиксированной длины
  3. Создайте несколько таких заметок под одним или несколькими пользователями. Каждая заметка будет делать 1000+ HTTP-запросов
  4. Откройте все заметки одновременно. Указанный сервер получит гору HTTP-трафика. Тысячи запросов уйдут на сервер в течение пары секунд.
Читать дальше →
Total votes 106: ↑98 and ↓8 +90
Comments 37

Nginx+php-fpm+perl под Debian Squeeze

Reading time 10 min
Views 124K

Для чего эта заметка, ведь похожих уже полно? Если кратко, то когда я взялся настроить связку пришлось перечитать огромное количество документации и разных статей, все сразу и в одном месте найти не получилось. Данная статья попытка систематизировать накопленные знания, а также максимально подробная помощь тем, кто только начинает осваивать nginx.

В качестве теста решил перевести все свои сайты на nginx, до этого все работало на Apache из состава ZendServerCE. Интересно было пробовать насколько сложно будет полностью переехать на новый для себя веб-сервер, ведь используется несколько CMS (DLE, Wordpress, самописныеCMS).

Задачи:
  • базовая работа web сервера — обработка html;
  • запуск php скриптов;
  • корректная работа phpmyadmin для всех сайтов на сервере;
  • запуск cgi и pl скриптов;
  • использование кеширования и подбор оптимальных параметров для увеличения производительности.


Имеем свежеустановленный сервер Debian 6 в минимальной установке из netinstall. И так поехали.
Читать дальше →
Total votes 75: ↑50 and ↓25 +25
Comments 66

Читаем (и пишем) MyISAM напрямую

Reading time 5 min
Views 12K
В недрах документации MySQL на dev.mysql.com я как-то обнаружил упоминание о том, что в случае, если используется MyISAM, можно получить прирост в скорости чтения из таблицы в 5-7 раз, если читать данные из таблицы самостоятельно. Мне довольно долго хотелось проверить этот факт и вот, наконец, у меня дошли руки до того, чтобы это попробовать. Что из этого вышло, читайте под катом
Читать дальше →
Total votes 48: ↑44 and ↓4 +40
Comments 13

11 «рецептов приготовления» MySQL в Битрикс24

Reading time 10 min
Views 39K


Проектируя, разрабатывая и запуская наш новый большой проект — «Битрикс24», мы не только хотели сделать по-настоящему классный сервис для командной работы (к тому же еще и бесплатный — до 12 пользователей), но еще и собрать и накопить опыт по эксплуатации облачных веб-сервисов, «прокачать» свою компетенцию в разработке высоконагруженных отказоустойчивых проектов и — самое главное — поделиться этими знаниями как с нашими партнерами, так и со всеми веб-разработчиками, кому близка тема «хайлоада». :)

Конечно, в одной статье (и даже не в одной) невозможно описать универсальный «рецепт», который бы подошел абсолютно для всех проектов: для кого-то важнее производительность (иногда — даже в ущерб надежности), для кого-то — наоборот, отказоустойчивость превыше всего, где-то много маленьких таблиц, где-то — большой объем данных…

Мы постарались описать те «изюминки», которые не раз помогали нам в работе в решении тех или иных практических задач. Надеемся, они окажутся полезными и для вас. :)
Читать дальше →
Total votes 102: ↑75 and ↓27 +48
Comments 35
1

Information

Rating
Does not participate
Location
Кострома, Костромская обл., Россия
Works in
Date of birth
Registered
Activity