Neurons to bytes

Archive for the ‘javascript’ Category

Путешествие по Губке Менгера. Javascript + Canvas.

04.10.2010 by Ouch! - 0 Comment
Posted in javascript, программерское

Наткнулся на пост у блоггера avva:

Совершенно замечательное демо трехмерного путешествия по губке Менгера. Смотреть в любом браузере, кроме Эксплорера. Весь код укладывается в 512 байт!

Там используется интересный алгоритм, который называется ray-marching. Должно быть не очень сложным и поучительным упражнением сделать unobfuscation всему этому коду и подробно объяснить, как он работает.

Я рекомендую смотреть демо в Google Chrome или Opera. Особенно рекомендую почитать комментарии к записи - там рассказывают, как работает код.

Кода всего ничего (512 байт):

<body bgcolor=0 text=snow onload=N=[K=R.getContext('2d')];for(t=B=127,I=K.getImageData(0,0,q=64,q);t--;$=Math.cos)N[t]=t/43&1;setInterval("t++;for(i=y=-1;y<1;y+=A)for(x=-1;x<1;x+=A=1/32,I.data[i+=4]=h+h)for(m=C=$(a=t/86),S=$(a+8),c=$(b=t/B),s=$(b+8),u=x*C+S,v=y*c-u*s,u=u*c+y*s,w=C-x*S,X=q+9*$(a+b),Y=q+9*$(b-a),Z=t,h=B;--h&&m<q;X+=u,Y+=v,Z+=w)for(m=1;N[X*m&B]+N[Y*m&B]+N[Z*m&B]<2&&m<q;m*=3);K.putImageData(I,0,0)",9)>JSpongy by p01<br><canvas id=R width=64 height=64 style=width:3in;height:3in;background:#fff>

LibCanvas - фреймворк для работы с canvas

04.08.2010 by Ouch! - 4 Comments
Posted in javascript, mootools, программерское

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

Как думаю я, не будет хватать именно какого-то фреймворка для построения интерфейсов, лайотов и создания векторной анимации.

Такой фреймворк скорее всего появится, и будет основан на технологиях Javascript, SVG и canvas. Возможно, он уже разрабатывается кем-то, но вот я пока об этом не знаю.

Сегодня на хабре один человек разместил статью http://habrahabr.ru/blogs/javascript/90339/, в которой он описал разрабатываемый их фреймворк как раз для тех целей, которые описывались мною в заметке про перспективы клиентских технологий. Так что я был прав в том, куда стремится веб.
Продолжаю следить за сабжем.

Скачать библиотеку LibCanvas можно здесь: http://code.google.com/p/libcanvas/

Перспективы клиентских технологий в веб

03.17.2010 by Ouch! - 6 Comments
Posted in javascript, программерское

Откушав чаю, я тут подумал, что в связи со всеми этими новыми технологиями и фишками, такими как HTML5, canvas, SVG и скоростью выполнения JS в современных браузерах, а так же постепенным выпиливанием IE6-7 (а скоро и 8-го), будет, как мне кажется, отход от технологий flash и silverlight.

Спрашивается, почему?

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

Такой фреймворк скорее всего появится, и будет основан на технологиях Javascript, SVG и canvas. Возможно, он уже разрабатывается кем-то, но вот я пока об этом не знаю.

Я думаю, будущее именно за такой открытой технологией, в отличие от flash и silverlight - нужно ждать только появления фреймворка и развития технологий в браузерах.

UPD: Действительно, такой фреймворк уже разрабатывается. Подробнее здесь: LibCanvas - фреймворк для работы с canvas

Javascript в nginx

02.16.2010 by Ouch! - 2 Comments
Posted in javascript

Игорь Сысоев, создатель веб-сервера nginx, написал заметку об идее встраивания javascript в nginx, наподобие того, как встроен perl.

Но, как рассказывает Игорь, пока нет возможности правильно встроить V8 в nginx из-за особенностей реализации.
Я вот что-то не могу понять, как тогда появилась такая вещь, как nodejs, которая, при всем при этом, держит огромную кучу запросов (я где-то видел тесты, не помню у кого)?

Или он просто плохо смотрел (в чем я не уверен)?

Короче, буду рад, если мне кто-нибудь разъяснит, чем так кардинально отличается nginx от nodejs, что в nginx пока нельзя корректно встроить v8?

Микрофреймворк fab для nodejs

01.13.2010 by Ouch! - 5 Comments
Posted in javascript, программерское

Наткнулся на замечательный микрофреймворк fab, который позволяет легко создавать простые серверные приложения на языке javascript, для веб-сервера nodejs.

Fab очень похож на ruby-фреймворк Sinatra, который является довольно популярной штукой в среде ruby-девелоперов, так как позволяет сделать легкое приложение, без использования тяжеловесов, таких, как Rails.

Например, так выглядит простейшее приложение в Sinatra:

require 'rubygems'
require 'sinatra'
get '/' do
  'Hello world!'
end

А вот так выглядит точно такое же приложение в fab:

fab = require( "./fab" ).fab;

( fab )
  ( "/", function(){ return 'Hello world!' })
.deploy();

Многословнее, но всё равно круто, да? Единственное там пока нету разделения запросов по REQUEST_METHOD, первой нужнейшей штуки для удобной реализации REST-сервиса.

Фреймворки для nodejs

01.09.2010 by Ouch! - 1 Comment
Posted in javascript, программерское

logo
Я просто оставлю это здесь. Список фреймворков для nodejs, которые я нашёл:

  • Намётки и размышления одного дядюшки Бена, который пытается создать свой фреймворк на nodejs. Смешно, он обозвал Дэвида Хэйнемайера Хэнсона тупицей, это повеселило :) Готового кода я там так пока и не нашел. А вот страничка проекта.
  • Simplex - здесь есть интересные куски кода, стоит посмотреть. Хотя это так - не фреймворк, а просто эксперимент, созданный за пару вечеров.
  • Raccoon - эта штука уже посерьёзней остальных. Буду её исследовать.
  • Вот еще один фреймворк, nerve
  • В комментариях Kuroki Kaze подсказывает, что есть еще JSAN. опенсурсовая библиотека javascript, но честно говоря, не слишком много я полезного там увидел.
  • Список проектов на github, посвященных nodejs

Если кто знает еще фреймворки для nodejs, буду признателен за ссылки в комментах.

Вообще, мне кажется, серверное программирование на js штука весьма перспективная. Не хватает только мощного фреймворка, по типу Zend или пакетов CPAN, как в Perl, или Gems, как в Ruby. Но это вопрос времени и я думаю, на эту тему стоит написать отдельный пост.

Получение ответа в виде JSON от Form.Request в Mootools

11.14.2009 by Ouch! - 2 Comments
Posted in javascript, mootools, Без рубрики

В Mootools есть отличное решение для отправки форм при помощи AJAX, это Form.Request. Он позволяет очень просто отправить форму без перезагрузки страницы.

После того, как форма отправлена, вы можете получить ответ в виде html, чистого текста или XML, в зависимости от того, какой заголовок Content-type вы отдаете на стороне сервера. Но чаще всего, нужно получить запрос в виде JSON, а в Form.Request это не предусмотрено.

Давайте посмотрим, как все таки получить нужный нам ответ в JSON:

new Form.Request($('login-form'), $('login-form-errors'), {
    resetForm: false, // Не сбрасывать форму после отправки

    // В случае успешного запроса
    onSuccess : function(target, text, xml) {
        // Если сервер что-то возвратил
        if (text.length) {
            // Перекодируем ответ в объект JSON
            var json = JSON.decode(text[0].data);
            ...
        }
    }
}).send();

Смотрите так же документацию по Form.Request

Цепочки вызовов функций (Chains) в MooTools 1.2

05.02.2009 by Ouch! - 0 Comment
Posted in IE bugs, javascript, mootools

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

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

Read the rest of this entry »

Darkbox for Mootools

04.30.2009 by Ouch! - 2 Comments
Posted in javascript

Переписал Darkbox - javascript для загрузки картинки во всплывающем слое. Оригинальный скрипт был написан Вадимом Макеевым на jQuery, но мне он не подходил, так как все свои клиентские скрипты я пишу с использованием Mootools.

Поэтому, потратив немного времени, написал порт Darkbox на Mootools.

Смотреть пример Darkbox for Mootools