По-добре ли е да използвате HTML5 & Canvas или CSS3 (фоново изображение) & jquery, за да направите слайдшоу?

Правя слайдшоу и изображенията няма да са статични, те ще се изтеглят динамично чрез масив и накрая ще изглежда така:

Това, което се чудя е, кое е по-удобно за процесора, CSS3 и jQuery, което кара преходите да избледняват просто чрез промяна на CSS класа на div, който ще запълни екрана, или, Canvas с нарисувано върху него опресняване на всеки време?


canvas jquery css cpu slideshow
person Noor    schedule 22.04.2010    source източник

Отговори (4)


arrow_upward
3
arrow_downward

Webkit (Safari, Chrome и т.н.) има вградена поддръжка за базирани на CSS ефекти на преходи и Mozilla работи и върху добавянето им. Възможността да използвате предоставените от браузъра преходи, където са налични, определено ще осигури повишаване на производителността.

Не съм сигурен какви са изискванията ви за съвместимост на браузъра, но имайте предвид, че никоя версия на IE все още не поддържа <canvas>. Можете да използвате библиотека на JavaScript, за да й осигурите псевдоподдръжка, но бих си представил, че това ще доведе до постигане на хит в производителността.

person awgy    schedule 22.04.2010
comment
Мисля, че направихте избора ми доста прост и ми дадохте добра причина защо трябва да използвам CSS3 и на всичкото отгоре защо не и canvas.. Благодаря! - person Noor; 22.04.2010

arrow_upward
3
arrow_downward

Не е нужно да използвате HTML5, но нищо не ви спира... всъщност ето слайдшоу за HTML5 (Използване HTML5)!

http://slides.html5rocks.com/

person scunliffe    schedule 22.04.2010
comment
Хубава връзка, наистина показва какво вече можем да постигнем с HTML5, може да бъде полезна! Благодаря! - person Noor; 22.04.2010
comment
Това трябва да се е случило наскоро - сега търся чиста връзка. - person scunliffe; 25.06.2013

arrow_upward
2
arrow_downward

Като се има предвид тъжното състояние, в което се намираме в момента, когато IE не поддържа CANVAS, тогава бих казал да се придържаме към версията jQuery. Освен ако, разбира се, нямате нищо против да изключите IE - но имайте предвид, че той все още е най-популярният браузър на пазара.

Бих казал също, че плъзгачите не са толкова интензивни за процесора и винаги бих поставял поддръжката и съвместимостта на първо място.

person Dan Diplo    schedule 22.04.2010
comment
Напълно пренебрегвах факта, че IE все още не поддържа canvas и единствената причина е, че искам да видя крайния резултат от сайта, който е много грешен. Както разбрах, IE9 ще поддържа canvas, но все още не е тук. Мисля, че ще прекодирам страницата, за да използвам css3, тъй като вече е внедрен в почти всички браузъри и наистина не би трябвало да забавя компютъра в този модерен свят..! благодаря за вашия принос - person Noor; 22.04.2010
comment
@Noor - MSFT заяви поддръжка за SVG в IE9 (както и много други неща, но AFAIK все още не са заявили, че ще поддържат CANVAS) - person scunliffe; 22.04.2010

arrow_upward
2
arrow_downward

Доста варианти ми хрумнаха:

  1. Преходите от JS/CSS са добре тествани и бързи за изпълнение. Използването на процесора е малко вероятно да е проблем.

  2. Ако обаче искате да опитате с опцията за платно и да поддържате базираното в Редмънд нещо за сърфиране, можете да опростите живота си, като рисувате чрез Raphaël API за различни браузъри.

  3. Чистите CSS преходи са най-елегантният (вероятно) метод. За съжаление хора извън Купертино са били мързеливи да ги прилагат, така че използването им в момента е ограничено предимно до впечатляващи допълнително удоволствие за очите.

  4. Ретро начин: преструвайте се, че е 2001 г. и тези момчета ви позволяват да направите сериозно изгаряне на процесора за няколкостотин долара.

person jholster    schedule 25.04.2010