full stack javascript developer
0,0
рейтинг
28 марта 2013 в 18:59

Разработка → Pixi.js — 2D движок с прозрачной поддержкой WebGL

Pixi.js позволяет использовать мощь WebGL для рендеринга 2D-сцен, совершенно не вникая в подробности реализации, более того, он умеет самостоятельно определять наличие поддержки WebGL и переключаться между способами рендеринга. В отсутствие WebGL рендеринг осуществляется средствами canvas. Кроме того в Pixi.js реализован граф сцены, поддержка текстур и спрайтов, чуть больше недели назад в нём появилась поддержка интерактивности — на спрайты можно повесить обработчики событий мыши и тачскрина.

Авторы позиционируют Pixi.js как 2D-аналог Three.js, и утверждают, что хотя игры — первое, что приходит в голову при виде их движка, он достаточно низкоуровненвый, чтобы его можно было применять везде, где требуется насыщенная 2D-анимация, например в сложных графических интерфейсах. При разработке основные усилия были направлены на скорость работы и простоту API.

Репозиторий Pixi.js на Гитхабе

Демо-игра на Pixi.js

>9000 зайчиков для тестирования производительности.

Илья Сименко @ilya42
карма
526,7
рейтинг 0,0
full stack javascript developer
Реклама помогает поддерживать и развивать наши сервисы

Подробнее
Спецпроект

Самое читаемое Разработка

Комментарии (48)

  • +5
    Неожидал. 32fps при 16,5k зайчиков.
    Скрин
    • 0
      На Nexus7 дела обстоят похуже.
      Скрин

      • 0
        А на Nexus4 нужно примерно полторы тысячи чтоб fps просел ниже 25
        • 0
          на fly iq446 ниже 25 fps при >300
    • 0
      Chrome 25.0.1364.172, 45 fps на этом же кол-ве и это очень круто.
      • 0
        что у вас там за зверюга на фоне?
    • +2
      Я вообще странно отношусь к тестам состоящим из одного Draw Call… Что оно вообще показывает?
  • +2
    16.5k зайчиков и 50+ fps. Неожиданно.
    • +1
      А какая у тебя видео скажи пожалуйста?
    • 0
      Да и пруфпик был бы полезен )
      • 0
        Suvitruf скинул в лс ( видео Radeon HD 6800 )
        Скрин
        • 0
          Читеры какие-то :)
          • 0
            Macbook Pro 13", HD3000, Core i5 2.3ГГц, Mac OS X 10.8.2, Chrome 26.0.1410.43 16.5к 49fps
            cl.ly/image/1i2G2T291w2V
  • 0
    Chrome 25: 30 fps
    FF 19: 48 fps
    Оперу 12 нагнули 4к зайцев до 7 fps
    • 0
      Та же ситуация, в Опере fps ощутимо ниже.
    • 0
      Opera 12
      7k зайцев, 23-27 fps
      Ubuntu 13.04
      Hd7770, открытые дрова
  • 0
    Хотелось бы увидеть сравнение работы этих зайцев в WebGL режиме и без WebGL.
    • +1
      Я подозреваю, что ситуация с низким fps в Опере — как раз из-за отсутствия поддержки WebGL.
      • 0
        В настройках включается
  • +2
    16.5k не интересно.
    Вот 1056k :)
    Скрытый текст
    Хром 27.0.1453.3 dev-m

    image
    • +1
      4224k
      Скрытый текст
      Хром 27.0.1453.3 dev-m

      image
  • 0
    Chrome Core-i3 Intel HD3000
    16500 зайцев 40..41 fps.
    Круто.
    • 0
      У меня при этих же характеристиках всего 15 fps
      • +1
        У меня ещё Mac, может это как-то играет роль…
        • +7
          Да, попробуйте его отодвинуть от компьютера и еще раз произвести тест.
    • 0
      А в FF ниже — 30fps.
    • 0
      На iPad 2 Safari игра притормаживает, но в целом играбельно.
      А в тесте 30fps при 960 кроликах.
    • 0
      Странно, у меня мак i5 +HD4000 и в хроме при 16500 всего 37 fps
  • 0
    На android работает очень быстро, и можно нормально управлять. Спасибо!
  • +1
    Ну вот. Теперь понятно, где можно писать простенькие игрушки, что-бы работали на как можно большем кол-ве платформ! Спасибо!
  • 0
    iPad3 — бесподобно
    Я в сметении, как такое вообще возможно?
    • 0
      При. 1к зайчиков начинает визуально подтормаживать, но блин — это невозможно нереально :)
  • 0
    Всего один вопрос — КАК?
  • 0
    Аплодирую стоя!
  • 0
    Asus TF300TG (android 4.1)
    начиная c 120 кроликов 30FPS активно падает. 450-550 кроликов — 17 фпс
  • 0
    Linux, Core i7-2600K (overclock 4.5GHz), GeForce GTX 560 Ti.
    На 16.5K зайцев:
    — chromium-25.0.1364.160 — 60FPS
    — firefox-17.0.4 — 63FPS
    — opera-12.14 — 25FPS (с включенным webgl)
  • 0
    Тестировал на HTC One X (смартфоны не последнее устройство), в хроме 1000 зайцев довели до 9 fps. А родной браузер показал 13 fps при 5000 зайцов. Не первый раз замечаю, что более продвинутый хром лажает.
    • 0
      Никто и не скрывает, даже признают, что Chrome медленнее Browser, именно поэтому он ещё не основной браузер.
      • 0
        Ну тогда совсем не понятно его позиционирование. Из плюшек только синхронизация закладок… Минусов невероятно много… Конкуренция внутри компании?
  • 0
    Хороший проект, да. Код местами страшный, я в какой-то момент не выдержал и мелких правок в него закоммитил (как слону дробина — там еще много всяких проблем, явных и неявных).

    Если разработчикам не наскучит, получится превосходное простое решение для спрайтовой графики.
    • +3
      Было бы интересно почитать анализ
  • 0
    Зайцы не тормозят и дают FPS столько же в среднем, сколько и у всех.
    Но игра почему-то показалась весьма тормознутой.
    Ubuntu 13.04, ATI, свободные драйверы, chrome-unstable, KDE с vsync.
  • 0
    iPad 2 — 30fps при 865 зайчиков
    А игрушка работает совершенно без тормозов
    Прекрасно :)
  • +1
    А вот знает кто, как владельцы мониторов на 120-144Гц могут получить больше 60?
  • 0
    Кстати, зависит еще от размера экрана (Chrome/Win7): при маленьком размере экрана браузера (800х600) 10 зайцев скачут на 60fps, при максимальном (1680х1050) fps падает до 20-22.
  • 0
    Интересно было бы увидеть насолько быстрее будет OSM kothic.js render, портированный на это.
  • 0
    Кроме высокого FPS, честно говоря, у библиотеки особенностей пока нет. Интерактивность примитивная — уловить правую кнопку мыши невозможно. Никаких средств для работы с текстом, графикой — исключительно спрайты: хочешь вывести текст? рисуй в канвасе, конверти в спрайт. Все объекты — прямоугольники, что создаёт вопросы об областях выделения.
    Документация и примеры грошовые, поддержку найти практически нереально, следует лезть в код и искать ответы там.
    Будем надеяться, со временем ситуация изменится к лучшему.
  • 0
    MacBook Air Mid 2013, на фуллскрине работает шустро
    image

Только зарегистрированные пользователи могут оставлять комментарии. Войдите, пожалуйста.