Метка «javascript» - 74

phpstorm

Продолжая делать упор на анализ и качество кода мы наконец добрались и до фреймворков. Работа над IDE уже продолжается, а прямо сейчас мы предлагаем попробовать:

  • Новый анализатор типов — меньше неверных предупреждений без дополнительных аннотаций
  • Больше предупреждений о runtime errors прямо в редакторе
  • Больше подсветки неиспрользуемого кода и конструкций
  • Панель сущностей MVC-фреймворков — пока Symfony 2 и yii, остальные по мере готовности
  • Прозрачная поддержка PHAR
  • Поддержка callbacks в литералах (call_user_func, etc) — включая поиск использования и рефакторинг
  • Серезные улучшения консоли БД — для всех баз данных — рефакторинг, экспорт, процедуры
  • Форматирование кода по стандартам PSR1/2, Symfony, Drupal
  • LiveEdit — редактирование PHP/HTML/CSS/JS видно в браузере в реальном времени без перезагрузки страницы
  • Серезно улучшена поддержка CSS/SASS/SCSS/LESS — анализ, дополнение, форматирование
  • Поддержка шаблонов Jade

Читать полностью »

Сегодня в корпоративном блоге Mozilla появилась запись одного из ключевых разработчиков Firefox Девида Андерсона (David Anderson) о том, что фонд заканчивает разработку нового движка для JavaScript под кодовым наименованием IosMonkey. Широкий круг пользователей сможет отметить повышение быстродействия браузера на страницах сложных веб-приложений уже с выходом Firefox 18, бета-версия которого будет выпущена 20 ноября.

Работа IonMonkey будет состоять из трёх фаз и выглядеть следующим образом: сначала будет выполняться трансляция в промежуточное представление (intermediate representation (IR)), к полученному результату будут применяться различные алгоритмы по оптимизации и уже после этого этот IR будет транслироваться непосредственно в машинный код.
Читать полностью »

Начну с оговорок.

  • Я не претендую на первенство. Очень может быть, что первым такое решение применил кто-нибудь уже в конце прошлого века.
  • Речь не идет о примерах кода, он наверняка плох. Хороша, на мой взгляд, идея — о ней и речь.

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

Коллекция паттернов поведения для элементов отзывчивого веб дизайнаДумаю любому современному дизайнеру или верстальщику рано или поздно в голову приходила мысль «А почему бы на этом проекте не использовать принципы отзывчевого веб-дизайна?». Пожалуй, сложно найти человека, который не слышал о responsive design в наше время, когда сёрфить веб могут с телефона, микроволновки и тапочек. Приступая к работе над подобным проектом, неплохо было бы иметь под рукой примеры возможного поведения лейаута и его отдельных элементов.
Читать полностью »

Здравствуйте, я разработчик игр на Flash. Последнее время все больше стало появляться постов про флешокапец, и MustHave JavaScript (дальше JS). Вроде как за JS будущие, и за открытым вебом.
Я долго не рассматривал JS всерьез как платформу для разработки игр. Ведь это интерпретированный язык, и скорость JS оставляет желать лучшего. Но совсем недавно был портирован на JS мой любимый фреймворк для анимации TweenLite. Вместе с этим автор создал тестовый пример показывающий производительность актуальных JS фреймворков: здесь.

Мне стало очень интересно, так как TweenLite JS выдавал неплохие FPS. И тут я решил написать такой же пример для сравнения Flash и JS фреймворков.
Дальше мне стало интересно сравнить FPS этих примеров в разных браузерах, и на разных ОС.
Сам тест — это анимация передвижения, и изменения размеров картинок, при чем можно изменять их количество. Тестовый пример для Flash лежит здесь, исходники примера здесь.
Читать полностью »

Введение

МегаФон — динамичная технологическая компания, работа которой не ограничивается исключительно предоставлением услуг связи. Например, среди наших активов есть большое количество интернет-сайтов, на которых клиенты получают различную информацию и услуги. В рамках проекта по совершенствованию и развитию наших веб-проектов мы, в том числе, создаём продукты, которые могут быть полезны и другим разработчикам. Сегодня мы хотели бы представить первый из них — шаблонизатор Histone, который является opensource-проектом, распространяемым по лицензии Apache Software License 2.0. Но обо всём по порядку.

Что такое Histone?

Многие из вас при создании веб-приложений используют различные шаблонные движки. Ситуация, когда из данных, представленных в определенном формате, вам необходимо сгенерировать некий HTML-код при помощи шаблона, задающего правила преобразования, встречается повсеместно. Несколько лет назад шаблонизаторы активно использовались для генерации HTML-кода на сервере (Smarty, FreeMarker, Velocity), сегодня все чаще и чаще возникает необходимость производить генерацию HTML-кода непосредственно в браузере. В качестве примера таких шаблонизаторов можно привести: TrimPath templates, Mustache, Google Closure Templates и т. д.Читать полностью »

Привет!

О плагине JsTree на хабре упоминалось лишь в далеком 2009 году. С тех времен все довольно сильно поменялось. Плагин активно развивается. Страница проекта на гитхабе.

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

JsTree — деревья это так просто

Если вам нужно отрисовать в брауезере просто дерево, то, конечно можно использовать и другие плагины, или вовсе написать это самому и лаконично, но для более широкого функционала — JsTree — просто отличный вариант.

Что мы имеем?

  • Построение дерева на основе html разметки, json и xml формата
  • Drag & drop с тонкой настройкой возможности перемещения нодов по дереву
  • Динамическо добавление/удаление/изменение нодов
  • Возможность построения нескольких деревьев на одной странице и манипуляция нодами между этими деревьями
  • Возможность присвоения нодам произвольных типов (file, folder, drive, да какой угодно), и указать отдельное поведения для каждого
  • Поддержка тем оформления (на скрине в начале статьи пример того, как это реализовал я)
  • Управление с клавиатуры
  • Использование нативных и кастомных чекбоксов
  • AJAX подгрузка нодов, запоминание состояния дерева
  • Плагин красиво и читабельно написан, позволяет писать дополнительные плагины к нему и без проблем кастомизировать.
  • Удобная система байндингов для обработки событий
  • Мультиязычность
  • Управление анимацией раскрытия
  • Поиск по дереву
  • Кастомное контекстное меню
  • Поддержка браузеров: IE 6+, Firefox 2+, Safari 3+, Opera 9+, Chrome
  • Мини-фича, которая меня особенно порадовала — плагин wholerow — выделения нода во всю ширину. А-ля mac style

Читать полностью »

«Что позволило остаться GIF, это — циклическое проигрывание анимации, которое добавил Netscape. Если бы Netscape не добавил поддержку GIF в свой браузер, GIF умер бы в 1998»

— Александр Тревор (Alexander Trevor),
руководитель команды по созданию GIF в CompuServe

Формат GIF в июне этого года отпраздновал свое 25-летие, и является сегодня самым старым графическим форматом, который распространен в интернете. Посвящая выходные просмотру смешных анимированных гифок понимаешь, что некоторые из них были бы в разы лучше со звуком. Все текущие решения для циклической анимации со звуком (например: coub.com, gifsound.com) предлагают отказаться от GIF, но это — не выход. И я решил пожертвовать просмотром гифок на выходных для решения этой крайне важной проблемы.

Первая в интернете гифка со звуком по ссылке. Надо нажать на синюю кнопку, а потом на гифке. Плеер должен работать во всех современных браузерах (тестировался в последнем Firefox и Chrome).

Гифок под катом не будет, а будет процесс создания расширения для стандарта, написания конвертера и плеера.
Читать полностью »

Дисклеймер.

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

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

Задача

Вот такие виджеты можно сделать
Представьте себе, что вы – web-программист, который реализует сложную SCADA систему, дашбоард (простите, но внятного перевода этого слова на русский я так и не встретил), интерактивную систему управления метриками, или просто вам нужно вставить на ваш сайт часы с хитрым дизайном. При этом вам нужно добавлять туда всяческие шкалы, крутилки со стрелками (на английском это называется Gauge), часики и другие «приборы», возможно даже интерактивные.

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

Однажды, при разработке сложного приложения на JavaScript-е возникла непреодолимая проблема — большой массив в Internet Explorer (далее IE). Так как я изначально проверял работу в Chrom-е, то не замечал каких-либо проблем при использовании массивов. Скажу больше — вложенные массивы не вызывали чувства страха. Chrom легко справлялся с трудными задачами. Однако IE, в очень жёсткой форме, указал на все мои огрехи и недостатки кода, особенно на обработку Больших массивов.
Читать полностью »


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js