Bonjour à tous,
J'ai un coeur à 100% de cpu dés que j'ouvre la page d'accueil.
C'est chiant c'est nuages, j'ai mon ventilateur qui se lance systématiquement...
Peut-être vaudrait-il mieux qu'ils arrêtent de défiler une fois passés ?

27 réponses


Grafikart
Réponse acceptée

Jvais masquer le bloc avec les nuages pour les gens inscrits du coup ça résoudra le pb pour certains :)

@Huggy: Ta machine ne doit pas être très véloce alors, avec mon core i5 2500 du boulot, j'atteins péniblement 20% de charge sur 1 coeur.
Quelle est ta config' ? Et surtout sous quel navigateur es-tu ?

Huggy
Auteur

Sur ma machine de dev j'ai un I7 Q720 4 coeurs 8 threads, donc je ne vois pas trop le ralentissement.
Le pb avec ces processeurs c'est que si un coeur prend 100% la fréquence chute de 2.8 GHz à 1.6 GHz pour tous les coeurs.

J'utilise FF en priorité mais avec Chrome c'est pareil.
Je pense que l'animation ne doit pas faire appel à la carte graphique, mais je n'ai pas regardé.
Avant quand c'était du flash, il suffisait de le désactiver

sinon j'ai un eeePc, un raspberryPi, un Odroid U3 (une merveille !!!)

Ah beh voilà ! FF ça devient du grand n'importe quoi côté perf', et notamment le JS sous Ubuntu c'est une écatombe (une courbe avec plus de 2000 points via le plugin C3.js et le navigateur plante ...) !
Tu es sous quel OS ?

Huggy
Auteur

Je suis sous W7 en dev , Lubuntu sur Odroid (Chrome) et Raspbian sur Raspberry (Midory)
c'est 100% quelque soit l'OS et quelque soit le browser

C'est fou ça, je suis sous Ubuntu au boulot et Win7 & Lubuntu à la maison, aucun soucis pour moi.
Regarde du côté de ton accélération matérielle au pire. Tu es sur IGP ou sur carte dédiée pour ton PC ?

Cest pas le site le probleme cest ton pc, rien quavec mon pc i3 il toutne tres bien

Huggy
Auteur

Quand je dis 100% c'est sur un coeur, ce qui fait à peine 15%
ça ne m'empêche pas de travailler, on est d'accord mais rien qu'a l'oreille, je sais si j'ai un onglet d'ouvert sur la page d'accueil de grafikart.

DubleYu: D'accord avec toi, je pense aussi que le soucis vientde son PC ou d'une config' quelconque.
Après évidemment que sur un Raspberry PI ou un Odroid ce genre d'animation prendra bien plus de ressources hardware que sur un core i7.

Oui cela viens forcement de ta config et non du site, des gens qui ont une config 10X plus pourrit tourne le site normalement.
revoit les optimisations de ton pc.

Bon courage

Pour avoir vécu le même souci récemment sur Mac Pro quad-core 3Ghz, 16 Go RAM avec ATI RADEON HD5770, j'atteste qu'il est temps de nettoyer l'intérieur de ta machine (dépoussiérage) et en priorité ta carte vidéo.
J'ai dû démonter le boitier de la carte vidéo, retirer un mouton de poussière de la taille d'une noix collé sur le ventilateur, décoller le dissipateur, remettre de la pâte thermique.
Depuis, plus de bruit, plus de crash, plus de souci de navigation sur des sites en flash, gifs animés et autres animations svg !
Bref, remontes tes manches, sors les outils et bon courage...

Huggy
Auteur

Après qques recherches, il apparait que les opérations translateX ne sont pas prise en charge par l'optimisation matérielle :(
par contre en faisant des translate3D ça devrait le faire
il me semble que Graf en avait parlé dans une vidéo.
pour info pour savoir si votre navigateur prend en compte l'optimisation matérielle
chrome://gpu
et sous FF about:support
Chez moi ça donne ceci

Accélération graphique
Date du pilote  7-29-2009
Description de la carte ATI Mobility Radeon HD 4570
Direct2D activé true
DirectWrite activé  true (6.2.9200.16571)
Fenêtres avec accélération graphique    1/1 Direct3D 11 (OMTC)
GPU 2 actif false
ID du périphérique  0x9553
ID du sous-système  02bd1028
ID du vendeur   0x1002
Paramètres ClearType    Gamma: 2200 Pixel Structure: R ClearType Level: 100 Enhanced Contrast: 300
Pilotes de la carte atiumd64 atidxx64 atiumdag atidxx32 atiumdva atiumd6a atitmm64
RAM de la carte 512
Rendu WebGL Google Inc. -- ANGLE (ATI Mobility Radeon HD 4570 Direct3D9Ex vs_3_0 ps_3_0)
Version du pilote   8.634.0.0
windowLayerManagerRemote    true
AzureCanvasBackend  direct2d
AzureContentBackend direct2d
AzureFallbackCanvasBackend  cairo
AzureSkiaAccelerated    0

pour tester sous chrome il y a http://stars.chromeexperiments.com/
vraiment bluffant
mais sous FF ça saccade un peu

Un pilote de 2009 pour la CG ça commence à dater (6 ans !!), il te faut le mettre à jour via le site AMD (ATI n'existe plus en tant que tel).

encore mieux - > http://www.touslesdrivers.com/index.php?v_page=29

met entierement ton pc a jour avec les derniers pilotes

si tu veux comparer voici mon resultat sous FF, pour ma part que ce soit FF ou chrome les deux sont rapide juste quelques rare ralentissement de quelques micro-seconde sous FF en testant avec le site que tu as link.

Date du pilote  12-23-2014
Description de la carte AMD Radeon HD 7800 Series
Direct2D activé true
DirectWrite activé  true (6.2.9200.16492)
Fenêtres avec accélération graphique    1/1 Direct3D 11 (OMTC)
GPU 2 actif false
ID du périphérique  0x679e
ID du sous-système  00000000
ID du vendeur   0x1002
Pilotes de la carte aticfx64 aticfx64 aticfx64 aticfx32 aticfx32 aticfx32 atiumd64 atidxx64 atidxx64 atiumdag atidxx32 atidxx32 atiumdva atiumd6a atitmm64
RAM de la carte 2048
Rendu WebGL Google Inc. -- ANGLE (AMD Radeon HD 7800 Series Direct3D9Ex vs_3_0 ps_3_0)
Version du pilote   14.502.1002.0
windowLayerManagerRemote    true
AzureCanvasBackend  direct2d
AzureContentBackend direct2d
AzureFallbackCanvasBackend  cairo
AzureSkiaAccelerated    0
Huggy
Auteur

@Cyprien G je le ferais quand j'aurai la preuve que la CG y est pour quelque chose
le pilote a l'age de la carte, et pour les jeux ça fonctionne très bien
et puis c'est de la 2D, faut pas pousser non plus.

Bonjour

je le ferais quand j'aurai la preuve que la CG y est pour quelque chose

Les pilotes doivent être mis à jour dès que des mises à jours sont disponibles.
Tu dis que le pilote de la carte graphique à l'âge de celle-ci, il y a surement eu des mises à jours du pilote depuis et ce n'est pas pour rien.
Les mises à jours sont faites pour que le matériel corresponde aux nouvelles technologies et aux nouveaux logiciels, si ce n'était pas nécessaire, ils ne feraient pas de mise à jour.
Et d'après toi, les sites ne devraient se mettre au niveau de ta configuration matérielle au détriment de leur design et de leurs fonctionnalités ?
C'est de l'euphémisme, tu ne trouves pas ?
Pour ma part, j'ai un ordinateur portable qui a près de 3 ans (c'est le seul ordinateur que j'ai actuellement et ce depuis 3 ans), je l'utilise autant pour le développement web que pour la navigation web et l'utilisation de logiciels tierces et je n'ai aucun problème.

Entierement d'accord avec Lartak, de plus tu dis que les jeux fonctionne bien mais les pilotes permettent egalement d'optimiser les performances de ta CG en fonction des jeux. Un pilote peut egalement faire que ta CG chauffe moins etc ....

@Lartak +1
C'est ton problème si tu ne fais pas les MAJ de tes composants, n'incrimine pas le site.

@Lartak: +1 !
@Huggy: C'est très important de maintenir les polites de son matériel à jour, car, comme le dit @Lartak, s'il y a des MAJ disponibles ce n'est pas pour faire beau, c'est pour assurer un maximum de compatibilité entre le hardware (aussi vieux soit-il) et le software.
Et puis en passant, faire un MAJ de la CG ce n'est pas ce qu'il y a de plus compliqué !

Et allez, c'est la fête aux +1! :P
+1 @Cyprien G

Huggy
Auteur

J'ai mis à jour mon pilote mais ça ne change rien :)
J'ai vu que sur ma config Chrome la rasterization n'était pas prise en charge par ma carte, par contre on peux la forcer en jouant sur les flags
chrome://flag puis activer Ignorer la liste des rendus logiciels
maintenant j'ai tout en vert dans chrome://gpu

Graphics Feature Status
Canvas: Hardware accelerated
Flash: Hardware accelerated
Flash Stage3D: Hardware accelerated
Flash Stage3D Baseline profile: Hardware accelerated
Compositing: Hardware accelerated
Multiple Raster Threads: Enabled
Rasterization: Hardware accelerated
Threaded Rasterization: Enabled
Video Decode: Hardware accelerated
Video Encode: Hardware accelerated
WebGL: Hardware accelerated

la vidéo d'intro du site Paypal est parfaite en fullHD et ne consomme que 3% de cpu !!!
https://www.paypal.com/fr/webapps/mpp/home

Je pense que l'animation de Graph n'est pas optimisée car elle fait appel à une boucle javascript qui force les valeurs des 4 translateX (4 nuages). C'est difficile à voir car le code js est minifié, seul lui pourrait nous en dire plus.
Pour les dessins des nuages, je pense que c'est du svg et c'est pour cela que je pensais à un problème de rasterization.
Quelqu'un a-til une config où l'animation ne consomme rien (ou quasiement) ?
merci de répondre avec éléments (type et freq cpu, CG ...)
merci de votre aide.

Chez moi, le cpu tourne à +/- 10% sur l'accueil (j'ai 1 millions d'autres trucs ouverts aussi...).
Tu peux déminifier les fichiers directement dans l'onglet Sources (et non pas Ressources) de l'explorateur, en cliquant sur les accolades en bas.

@Cavalor: C'est parce que c'est la pomme, tu ne dois pas avoir le module iAnimation disponible pour 99€ sur l'appStore troll

@Grafikart Met un petit coup de margin-top, parce que là, ça fait bricolage xD

Pour répondre à @khalysto, et pour avoir fait un test rapide, je propose :

.container.home {
    padding-top: 2rem
    }

Ça marche pas trop mal, sur Macbook Pro 15" (non retina)

;-)

Actualisez :) vous avez le vieux CSS en cache :)

Ah le cache ... combien de fois j'ai dit à mes collègues et mes chefs "Vide ton cache bor*** !" :)