Pull to refresh
13
0
Дмитрий Муштат @Mushtat

User

Send message

Уязвимая SCADA-система могла заставить мировых лидеров томиться в пробках

Reading time2 min
Views12K
По сообщению The Register, в ноябре 2014 года в Австралийском городе Брисбен пройдет встреча мировых лидеров в рамках саммита G20. Администрация штата Квинсленд, в котором располагается Брисбен, проводит серьезную подготовку к этому событию, в первую очередь, нацеливаясь на безопасность.
Читать дальше →
Total votes 32: ↑22 and ↓10+12
Comments10

Шум Перлина (Perlin Noise)

Reading time10 min
Views71K
Доброго времени суток. Предлагаю Вашему вниманию перевод статьи про шум Перлина (вот этой). Ссылки на эту статью уже мелькали на хабре (тут), но перевод статьи мне не попался. Так что надеюсь кому-либо он может оказаться полезен.

Многим людям приходилось использовать генератор случайных чисел в программах для создания непредсказуемости, чтобы сделать движение и поведение объектов более натуральным или генерировать текстуры. Генераторы случайных чисел, конечно, имеют свои области применения, но иногда их выход может быть слишком «жесткий», чтобы казаться естественным. В этой статье мы представляем функцию, которая имеет очень широкий спектр применения, больше, чем я мог бы думать, но в основном везде, где вам нужно чтобы что-то выглядело естественного происхождения. К тому же вывод может быть легко настроен под ваши нужды.

Если посмотреть на многие вещи в природе, вы заметите, что они являются фрактальными. Они имеют различные уровни детализации. Типичным примером является очертание горного хребта. Оно содержит значительные различия в высоте (горы), средние изменения (холмы), небольшие вариации (валуны), крошечные изменения (камни) и так далее. Посмотрите на что угодно: распространение пятен травы на поле, волн в море, движение муравьев, движение ветвей дерева, узоры из мрамора, ветра. Все эти явления поддаются той же схеме, в больших и малых вариациях. Функция шума Перлина воссоздает это, просто складывая функции шума в различных масштабах.

Для создания функции шума Перлина, вам нужны две вещи, функции шума и функция интерполяции.
Читать дальше →
Total votes 67: ↑52 and ↓15+37
Comments22

Маленькие программы на Javascript: куда податься

Reading time4 min
Views44K
Да, я про лавинообразный поток статей про программы на javascript в 30 строк, охвативший Хабр. Честно сказать, я и сам ярый любитель (специальной?) дисциплины код-гольфа на js, и провел не один выходной, пытаясь втиснуть функцию в твит. И хотя мне нравится дух тридцатистрочников, мне не по духу этот формат.

Почему? Ограничение в 30 sloc весьма и весьма размыто: a.pop();s+='foo' — скорее две строки, а a.pop(s+='foo') — скорее одна, хотя эти два куска кода делают абсолютно одно и то же. Да и практика показала, что даже 30 слоков не обязательное ограничение, а HTML и CSS вовсе не считаются. Иными словами, слоками померить крошечность невозможно, да и это никому не нужно.

Господа, это не серьёзно.

Но это не значит, что нужно прямо сейчас бросить недописанный к пятнице тридцатистрочник. Но когда наиграетесь, добро пожаловать в высшую лигу!
Читать дальше →
Total votes 192: ↑168 and ↓24+144
Comments17

Миникрафт в 252 символа

Reading time5 min
Views41K
В продолжении популярного цикла статей о том, что 30 строк джаваскрипта достаточно каждому, предлагаю Вашему вниманию перевод статьи Мэтью P01 Генри о его последней работе:


Итак, Мэтью пишет:
Total votes 170: ↑151 and ↓19+132
Comments12

Алгоритм «diamond-square» для построения фрактальных ландшафтов

Reading time12 min
Views117K
Карта игры Minecraft, созданная с помощью приложения CartographДумаю, многие знакомы с весьма необычной игрой Minecraft (справа — пример сгенерированной в ней карты), в которой игрок находится на (практически) бесконечной поверхности Земли и может исследовать окружающий мир с минимальными ограничениями.

Как же автору игры, Notch'у, удалось добиться подобного сходства его случайных «миров» с земными просторами? В этом топике я как раз и рассмотрю один из способов построить искусственный ландшафт такого рода (и вскользь упомяну пару других способов), а также расскажу о моем небольшом усовершенствовании этого алгоритма, позволяющем значительно увеличивать размеры ландшафта без заметных потерь в производительности.

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

Читать дальше →
Total votes 148: ↑147 and ↓1+146
Comments58

Вспоминая прошлое. О том, что делали 5 лет назад

Reading time4 min
Views40K
В Украине есть такая интересная штука, как Малая Академия Наук. В общем, это что-то вроде конкурса проектов для учащихся по школам. Довольно интересные проекты попадаются, и об одном я вам сейчас поведаю.



Проектик этот — мой, случайно напомнивший о себе, пока наводился порядок в книжном шкафу. Тема его, тогда, 5 лет назад, казалась ужасно крутой и звучала так: «Методы генерации игровых карт». Чуть выше пример того, что у меня получалось. Как видите, это стилизованные под рогалик примеры уровней какой-то там несуществующей игры. Но обо всём по порядку.
Подробности
Total votes 96: ↑88 and ↓8+80
Comments39

Знакомство с Parallax Scrolling

Reading time4 min
Views292K
Любой, кто играл или наблюдал за игрой друзей, либо в принципе видел игры, которые были выпущены в 80-90-х годах, должны быть знакомы с техникой параллакс-скроллинга.

Вспомните такие игры, как Mario Bros, Streets of Rage, Mortal Kombat, Turtles in Time или оригинальную игру Moon Patrol. В этих играх техника параллакса наблюдается в тот момент, когда несколько фоновых слоев с различными текстурами двигаются с разной скоростью, что создает эффект трехмерного пространства.

Почему я начал говорить о ретро-играх в статье о веб-разработке? Самым простым ответом мог бы быть «потому что они клевые», но нет. Параллакс-скроллинг является классным дизайнерским концептом, который прокладывает свой путь в мир веб-дизайна. Nike были одними из первых, кто использовал эту технику с большим успехом, когда они наняли маркетинговых гигантов Weiden and Kennedy для разработки их оригинального сайта Nike Better World. Сайт Nike Better World с того времени был обновлен и заменен на новый, однако есть другой сайт, довольно похожий на то, как выглядел первый параллакс-дизайн от Nike — сайт о спортивных напитках Activate.


Читать дальше →
Total votes 99: ↑92 and ↓7+85
Comments35

jBone. Замена jQuery для Backbone или 2kb для DOM манипуляций

Reading time3 min
Views12K
NPM version

jBoneПриветствую всех.

jBone — микро библиотека (2кб gzipped) для работы с DOM в современных браузерах. Она частично имплементирует интерфейсы jQuery для основных методов необходимых для корректной работы Backbone, но может использоваться и независимо.

Проблема


jBone родился при решении конкретной задачи — разработки мобильного приложения. Основными требованиями были отзывчивость UI и скорость загрузки приложения. Очень скоро стало ясно, что почти половину всего кода у нас занимает jQuery, причем решались с помощью него очень простые задачи.
Читать дальше →
Total votes 32: ↑28 and ↓4+24
Comments16

Одна из самых больших DDoS-атак в истории

Reading time2 min
Views177K
На протяжении последней недели многие пользователи интернета в Европе столкнулись с задержками и кратковременной недоступностью множества сайтов. Их причина — бушевавшая всё это время DDoS-атака, достигавшая 300 гигабит в секунду — одна из самых крупных, возможно даже самая крупная за всю историю интернета. Масштаб атаки был таков, что её ощутили даже «киты», на которых стоит интернет — Tier-1-операторы и крупнейшие точки обмена трафиком европейских столиц.

Причиной атаки стал конфликт между организацией Spamhaus, составляющей списки распространителей спама, и голландским провайдером Cyberbunker. Конфликт разгорелся после того, как Spamhaus включила Cyberbunker в списки спамеров. Cyberbunker — один из самых радикально настроенных «абузоустойчивых» провайдеров. Его услугами пользовалась Пиратская Бухта. Штаб-квартира и серверы Cyberbunker расположены в пятиэтажном здании бывшего военного бункера НАТО — отсюда и название. Как утверждает Spamhaus, в ответ на включение в чёрный список Cyberbunker начал атаку.
Читать дальше →
Total votes 220: ↑206 and ↓14+192
Comments126

Пишем single-page web application framework в 60 строках кода

Reading time5 min
Views76K

В качестве предисловия



Веб-дизайнерский народ в последнее время распробовал single page web applications. Что оправдано во многих случаях.
Но явно ошибочно считать что single page web application не сделать без чего-то типа AngularJS, Ember и прочих Knockouts.
Во всяком случае если вам нужно сделать нечто простое типа To-do списка совершенно не обязательно тащить на клиент килобайты мега-фреймворка. На самом деле килобайты трафика это пол беды. Основная цена, скажем AngularJS, в том что он, как любой универсальный data binding механизм, создает значительную run-time нагрузку.

Эта статья про то как в 60 строках кода + jQuery/Zepto сделать простой app framework котрый можно расширять под свои нужды и без лишних сущностей в нагрузку.

Постановка задачи



Наш framework должен ...:

  1. … поддерживать routing, т.е. должна быть возможность сказать в деклартивной модели: «этот вот url hash должен быть показан в этом view».
  2. Должна быть возможность динамической загрузки разных view. Какие-то части нашего приложения могут быть либо тяжелы для начальной загрузки, либо не нужны, например, для незалогиненного пользователя.
  3. Должна быть возможность динамической загрузки скриптов. По причинам изложенным в п. 2
  4. Наше приложение будет поддерживать browsing history — кнопка «назад» в браузере должна показывать предыдущую страницу и т.д.
  5. Ну и все это должно быть компактным и расширяемым как того будет требовать логика нашего приложения.


Пример того что мы хотим получить



Приложение Bootstrap'нутый список контактов — содержит сам список, карточку — детали контакта и некую панель управления (dashboard). Что будет на той панели нам не важно — знаем что что-то будет и ладно.

Personas demo

Поехали
Total votes 75: ↑57 and ↓18+39
Comments55

Harmony collections NOW

Reading time11 min
Views9.6K

На хабре уже проскакивала статья про такие замечательные вещи, как Map, WeakMap и Set, но в действительности реальные возможности этих API не были раскрыты (если я все-таки хорошо воспользовался поиском).
Эти API толком не реализованы нигде, кроме firefox (можно включить в chrome canary), но даже там до недавних пор не поддерживалось использование HTMLElement-подобных объектов в качестве ключей. Polymer, например, убрал только три недели назад

	if (navigator.userAgent.indexOf('Firefox/') > -1)


Чем же они так хороши? По сути Map/WeakMap можно воспринимать как обычные хэш-объекты, только в качестве ключей можно использовать только сложные объекты (Object, Function, Array), так как привязка идет не по содержимому, а по адресу в памяти.
Таким образом появляется возможность привязаться на фронтэнде к
  • dom-элементу
  • XHR-запросу
  • File-элементу


Это дает нам возможность работать без id-шников элементов, делать дата-биндинг в разы быстрее, создать безумную альтернативную реализацию promises и так далее.
Мы будем говорить о WeakMap. Даже не так, мы будем говорить о существующих полифиллах для WeakMap.

Читать дальше →
Total votes 41: ↑38 and ↓3+35
Comments16

Как 45 минут терять по $172 222 в секунду

Reading time4 min
Views157K
Это, пожалуй, самый болезненный отчет об ошибке, который я когда-либо читал. Он красочно описывает шаги, которые привели к потере 465 миллионов долларов компанией Knight Capital в связи с ошибкой программного обеспечения, проявившейся в прошлом году и обанкротившей компанию.

В этом отчете есть все характеристики технического долга в огромной, лишенной поддержки и запущенной базе кода (ошибка произошла из-за исполнения кода, который не использовали почти 9 лет) и ужасная и грустная история взаимодействия между разработчиками ПО и ИТ-профессионалами.
Читать дальше →
Total votes 178: ↑164 and ↓14+150
Comments94

Очередная программная закладка в роутерах D-Link

Reading time2 min
Views132K
image

На информационном портале devttys0.com некто Craig Heffner – опытный специалист в области реверс-инжиниринга – выложил статью-исследование очередной (уже находили) программной закладки в роутерах D-Link. На этот раз закладка была выявлена в официальной прошивке для DIR-100 revA, но, по его мнению, присутствует в роутерах других серий:

  • DIR-100
  • DI-524
  • DI-524UP
  • DI-604S
  • DI-604UP
  • DI-604+
  • TM-G5240
  • Planex BRL-04UR
  • Planex BRL-04CW

Коротко говоря, если у вашего браузера установлен User-Agent как «xmlset_roodkcableoj28840ybtide», то вы автоматически получаете админский доступ к веб-панели управления роутером без всякой авторизации.
Подробнее
Total votes 217: ↑213 and ↓4+209
Comments105

Создание гравитационной и портальной пушки. Как правильно убить персонажа в машине и создать теплый вязаный интерфейс

Reading time11 min
Views39K
Привет Хабра!

Эта статья продолжает цикл статей об игровом движке StalinGrad. В прошлой статье мы насиловали DHTML, а в этой — будем насиловать архитектуру и прототипы.

Кода практически не будет, поэтому, если вы не web разработчик, можете просто почитать про архитектуру и ООП. И таки да — про HTML5 тут снова ничего не будет, только DHTML-хардкор :)



Сразу короткое демо:
Пример 1 — паралельные миры
Пример 2 — один мир с разных камер
Пример 3 — боты
Пример 4 — нянкэт, облака и портальная пушка
Читать дальше →
Total votes 93: ↑88 and ↓5+83
Comments34

«А что если», Event Sourcing

Reading time4 min
Views70K
Наверное, про Event Sourcing слышал каждый, кто хоть раз пересекался с темой CQRS и DDD. Это подход хранения данных, при котором вместо конечного результата храниться череда записей о событиях происшедших с некоторой сущностью. На сайте Мартина Фаулера есть подробное описание, а мы же остановимся на фундаменте, основных «печенюшках», а также проблемах в его применении.
Читать дальше →
Total votes 37: ↑32 and ↓5+27
Comments106

Обфускация JavaScript

Reading time5 min
Views195K
В статье собраны всем известные методы и предельно извращенные. Эту статью я решил написать после недавнего прочтения поста в блоге Badass JavaScript и решил её дополнить своими находками.

Первый способ


Он всем известен — обфускация минимизаторами такими как JS Packer, JSmin, YUI Compressor, Closure compiler или можно просто пугуглить «JavaScript Obfuscator» и найдется ещё сто штук разных обфускаторов.
Они превращают существующий код
function MyClass(){
    this.foo = function(argument1, argument2){
        var addedArgs = parseInt(argument1)+parseInt(argument2);
        return addedArgs;
    }
    var anonymousInnerFunction = function(){
        // do stuff here!
    }
}

В какой-то такой вид:
function MyClass(){this.foo=function(c,b){var d=parseInt(c)+parseInt(b);return d};var a=function(){}};

Или такой:
var _0xd799=["\x66\x6F\x6F"];function MyClass(){this[_0xd799[0]]=function (_0xefcax2,_0xefcax3){var _0xefcax4=parseInt(_0xefcax2)+parseInt(_0xefcax3);return _0xefcax4;} ;var _0xefcax5=function (){} ;} ;

Или вот такой:
eval(function(p,a,c,k,e,d){e=function(c){return c};if(!''.replace(/^/,String)){while(c--){d[c]=k[c]||c}k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}return p}('4 0="3 5!";9 2(1){6(1+"\\7"+0)}2("8");',10,10,'a|msg|MsgBox|Hello|var|World|alert|n|OK|function'.split('|'),0,{}))

Но ничего не стоит его восстановить с помощью jsbeautifier.org либо просто убрать eval и получить исходный код, многое потеряем, но смысл кода восстановим. Ну и с первого взгляда мы видим, что перед нами JavaScript.

Все это были цветочки под катом жесткие методы обфускации.
Читать дальше →
Total votes 171: ↑165 and ↓6+159
Comments85

RESTful API на Node.js + MongoDB

Reading time16 min
Views258K
Я, будучи разработчиком мобильных приложений, часто нуждаюсь в backend-сервисах для хранения пользовательских данных, авторизации и прочего. Конечно, для подобных задач можно использовать BaaS (Parse, Backendless, etc…). Но свое решение — это всегда более удобно и практично.

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

В данной статье будет рассмотрено построение REST API для мобильного приложения на Node.js с использованием фреймворка Express.js и модуля Mongoose.js для работы с MongoDB. Для контроля доступа прибегнем к технологии OAuth 2.0 с помощью модулей OAuth2orize и Passport.js.

Пишу с позиции абсолютного новичка. Рад любым отзывам и поправкам по коду и логике!

Содержание

  1. Node.js + Express.js, простой web-сервер
  2. Error handling
  3. RESTful API endpoints, CRUD
  4. MongoDB & Mongoose.js
  5. Access control — OAuth 2.0, Passport.js

Читать дальше →
Total votes 44: ↑41 and ↓3+38
Comments63

Наш взгляд: Meteor против Derby

Reading time11 min
Views18K
От переводчика: Не встречал на хабре материалов, посвященных фреймворку Derbyjs, который часто упомянается, как основной конкурент Meteor. Под катом сравнение этих двух фреймворков, сделанное авторами Derby. Сравнению уже больше года, но тем, кто не читал, думаю будет интересно.
Читать дальше →
Total votes 12: ↑11 and ↓1+10
Comments36

Ratchet — быстрое прототипирование мобильных приложений на HTML, CSS и JS

Reading time1 min
Views24K


Ratchet — новый фреймворк, который позволяет быстро создавать прототипы приложений для iOS. По сути является аналогом Twitter Bootstrap для мобильных устройств.

Сайт проекта | Ratchet на GitHub | Обсуждения в Google Groups | Twitter
Читать дальше →
Total votes 41: ↑37 and ↓4+33
Comments27

PhoneJS — Новый HTML5-фреймворк для мобильных приложений

Reading time8 min
Views66K
Новые инструменты для разработки под мобильные устройства появляются сегодня чуть ли не каждый день. Большая часть из них — это HTML5-фреймворки, с помощью которых, обладая навыками веб-программиста, можно создавать приложения для смартфонов и планшетов, не углубляясь в изучение платформенных SDK и других языков.

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



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

Мы в DevExpress организовали небольшую команду, которая на протяжении нескольких месяцев анализировала и пробовала различные существующие средства и подходы. Результат полученного опыта — PhoneJS — наше комплексное решение для создания кросс-платформенных мобильных приложений на HTML5.

Встречайте PhoneJS
Total votes 133: ↑110 and ↓23+87
Comments71

Information

Rating
Does not participate
Registered
Activity