Dans la plupart des cas, évite d'ajouter les articles déjà présents dans
la base de données, en faisant une pré-requête (une par flux, pas une
par article).
Par exemple, si un flux RSS fournit 20 articles, alors la pré-requête
charge une liste d'exclusion de 20+2 identifiants d'articles.
Ce patch réduit considérablement le nombre de requêtes et la charge de
la base de données durant les mises à jour, et en particulier le trafic
réseau entre PHP et la base de données.
Les mises à jour sont du coup aussi plus rapides.
Fonctionne aussi si DOMContentLoaded est déjà consommé avant le
chargement de main.js, et permet d'attendre les autres scripts tels
jQuery si ceux-ci ne sont pas encore chargés.
Grosse amélioration des performances en utilisant le cache HTTP :
- Implémentation de HTTP/1.1, c.a.d. If-Modified-Since, If-None-Match,
If-Unmodified-Since, If-Match... avec la librairie
http://alexandre.alapetite.fr/doc-alex/php-http-304/
- Support de HEAD (HTTP /1.0).
- Préchargement de la page suivante (avec link next prefetch) dans le
cas de pagination.
- Et nouvelle possibilité de navigation pour les navigateurs qui
supportent "next".
- La date de dernier changement est pour l'instant primitive et
correspond au dernier changement de la session PHP ou
Configuration.array.php ou application.log ou touch.txt.
- touch.txt est modifié a chaque requête UPDATE ou INSERT ou DELETE.
* Fusion de endless_mode.js dans main.js car endless_mode.js est
toujours chargé et assez petit.
* Suppression des changements de style en JavaScript lors du chargement
(genre boucle de .hide(), ou d'ajout de classe ".stick") et
implémentation en PHP + CSS à la place.
* Chargement JavaScript asynchrone (defer + async) pour de meilleurs
performances.
* Utilisation préférable des événements globaux plutôt que des
événements pour chaque élément avec jQuery.on(events, selector) pour un
chargement plus rapide et moins de mémoire utilisée.
* Optimisation manuelle du JavaScript (sélecteurs CSS plus performants,
méthodes jQuery plus appropriées, etc.).
* Désactivation de init_img() qui était coûteux, lancé à un moment où
les images ne sont de toute manière pas encore chargées, et qui
n'apporte rien car il y a déjà un img {max-width:100%} en CSS.
* JavaScript en mode strict.
* Enfin, passage du code JavaScript dans JSLint et du coup nombreuses
corrections (syntaxe, variables, méthodes dépréciées...).
* Devrait permettre de fermer
https://github.com/marienfressinaud/FreshRSS/issues/121
* Au passage, quelques simplifications CSS pour de meilleures
performances.
Il semble qu'il y aurait pas mal de changements à faire pour supporter
IE8 (qui ne supporte pas les sélecteurs CSS3 par exemple).
Vue l'audience probable de FreshRSS, il me semble raisonnable de
commencer à IE9, et dans ce cas jQuery 2.x est mieux (entre autres plus
léger) que la branche 1.x qui supporte IE6+
http://jquery.com/browser-support/
LazyLoad.js utilise énormément de CPU et ralentit considérablement le
défilement de page, en particulier lorsque le nombre d'articles
augmente.
Dans le cas des articles repliés, il n'y a en fait pas besoin du
mécanisme complexe de LazyLoad.js basé sur les événements scroll, car il
suffit de charger les images lors du dépliage es articles, et cela
allège énormément l'expérience.
Nouvelles options pour choisir d'afficher ou pas les icônes pour marquer
comme lu/non-lu, favoris, lien vers l'article, ainsi que les champs
partage, tags...
Légères simplifications CSS et PHP au passage.
(Note pour plus tard : Il serait peut-être souhaitable de simplifier le
mécanisme des options en PHP, par exemple en utilisant un tableau de
propriétés. Actuellement, il y a un attribut par option accompagné d'un
accesseur privé, un accesseur public, et idem dans le système de
chargement/écriture du fichier de configuration, ce qui fait beaucoup de
code PHP par option)
notification.js était tout petit et occasionnait une requête
supplémentaire et un événement JavaScript en plus.
Proposition de fusion dans le nouveau main.js statique.
En JavaScript, sans requête au serveur, décrémente ou incrémente le
nombre d'articles non lus ou en favoris suite à une action de
l'utilisateur.
Utilise un nouvel attribut data-unread pour stocker le nombre d'articles
non-lus et du pur CSS pour afficher cette valeur.
Nouvel attribut data-priority (pour savoir s'il faut inclure le flux ou
pas dans les nombres d'articles non lus).
Légère simplification CSS au passage (d'autres optimisations des
performances CSS seraient souhaitables en évitant les règles contenant
trop de sélecteurs universels imbriqués genre ".categories .favorites
.btn" et en évitant les changements de style en JavaScript lors du
chargement - j'essayerai de faire une proposition dans un patch séparé).
Bug connu : une catégorie finissant par une espace suivi d'un nombre
entre parenthèses comme "Exemple (2)" cause actuellement un léger bug
d'affichage dans le <title> s'il y a 0 article non lu et que
l'utilisateur en marque un comme "non lu". Il faudra une modification
pour utiliser data-unread aussi pour le <title>
La dernière catégorie n'était pas générée correctement si elle ne possédait
qu'un seul flux. Le bug venait de HelperCategorie::daoToCategoryPrepopulated
Je l'ai réécrite pour qu'elle soit un peu plus claire