• Home
  • A Propos
  • Greasemonkey
  • HowTo GitHub
  • Performance JavaScript
  • SharepointPlus

15

Juin

How to cache the CSS Fonts with Sharepoint

Posted by Aymeric  Published in Astuce, English, Niveau débutant, Performance

If you use your own CSS file with your own CSS fonts, then we’ll notice that Sharepoint doesn’t send cache headers if you use the below CSS code:

@font-face {
  font-family: 'Roboto';
  src: url('/_catalogs/masterpage/css/fonts/Roboto/Regular/Roboto-Regular.woff2') format('woff2'),
       url('/_catalogs/masterpage/css/fonts/Roboto/Regular/Roboto-Regular.woff') format('woff'),
       url('/_catalogs/masterpage/css/fonts/Roboto/Regular/Roboto-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
}

To have this resource sent back from the Sharepoint server with cache headers, you just need to add ?ctag=0 at the end:

@font-face {
  font-family: 'Roboto';
  src: url('/_catalogs/masterpage/css/fonts/Roboto/Regular/Roboto-Regular.woff2?ctag=0') format('woff2'),
       url('/_catalogs/masterpage/css/fonts/Roboto/Regular/Roboto-Regular.woff?ctag=0') format('woff'),
       url('/_catalogs/masterpage/css/fonts/Roboto/Regular/Roboto-Regular.ttf?ctag=0') format('truetype');
  font-weight: 400;
  font-style: normal;
}

Tags: Astuce, css, english, Niveau débutant, Performance, Programmation, sharepoint

no comment

15

Déc

Quickly find if an object is an array [JavaScript]

Posted by Aymeric  Published in Niveau débutant, Performance, Programmation

You could use Array.isArray(obj) but it’s not available for IE8 and it doesn’t seem very good on the performance side. The best one on the different browsers is to test: obj instanceof Array

Tags: javascript, Niveau débutant, Performance, Programmation

no comment

2

Jan

Réduire la taille d’une photo JPG sans perdre en qualité [HOWTO]

Posted by Aymeric  Published in Astuce, Images, Niveau débutant, Performance, Windows

[niveau débutant]

Il existe un moyen de compresser encore plus les photos JPG (et PNG, et GIF) grâce à une technique avancée de compression. Il va d’abord falloir installer quelques programmes, après quoi vous verrez que c’est extrêmement simple et utile au quotidien !

Pour faire cela nous allons utiliser le logiciel IrfanView (cliquez sur « Download » dans la colonne de gauche puis sur le bouton « Download Now – Get it from CNET Download.com! »).
Une fois téléchargé vous pouvez lancer l’installation : vous pouvez laisser les options par défaut, attention cependant parce qu’Irfan View va vous proposer d’installer la toolbar de Google, et je vous déconseille de le faire :
Fenêtre qui apparait durant l'installation et qui propose l'ajout de Google Toolbar, et il est surveillé en jaune le fait de décocher la case

Maintenant il va s’agir d’ajouter le plugin RIOT (RIOT signifie Radical Image Optimization Tool). Pour cela télécharger l’ensemble des plugins disponibles sur cette page : http://www.irfanview.com/plugins.htm (cliquez sur « Brothersoft.com – download IrfanView plugins » puis sur le bouton « Download now »).

Une fois le fichier téléchargé, double cliquez dessus pour lancer l’installation.

Il apparait qu’IrfanView ne fournit pas la dernière version du plugin RIOT, on va donc devoir la télécharger via http://download.criosweb.ro/download.php?sid=R-dll&type=installer (attention de bien cliquer sur le bouton gris qui est tout en haut et qui se nomme « Download RIOT DLL version ») :
Illustration du bouton de téléchargement

Cela a pour effet de télécharger un fichier .zip : faites un clic droit sur ce fichier nouvellement téléchargé puis choisissez « Extraire ici », ou « Extraire tout », ou « Dézipper ici » (cela peut varier selon la configuration de votre ordinateur).
Une fois décompressé, vous allez trouver un fichier qui se nomme « Riot-plugin.exe ». Double cliquez dessus. Durant l’installation il devrait vous proposer d’installer le plugin pour IrfanView :
Fenêtre qui apparait durant l'installation
Il va vous demander si vous souhaitez installer « DriveScanner 2011 »; choisissez Ne pas installer DriveScanner 2011

C’est bon ! Toute l’installation est effectuée, on peut passer à la suite…

Il va falloir ouvrir IrfanView qui se trouve dans votre menu Démarrer :
Visualisation de IrfanView dans le menu Démarrer

Deux possibilités….

1. Si vous souhaitez modifier un ensemble de photos d’un coup

Ouvrez une image au hasard (ça n’a pas d’importance ici) dans IrfanView, puis faites File > Save for web... (plugin). Si vous avez une alerte avec le message suivant, alors cliquez sur « No » :
This file contains a high resolution image. RIOT can handle such images, but processing can be quite slow in this situation. Do you want to resize it first ? (recommanded) The original image won't be modified

Cliquez sur « Batch » dans la barre :
Barre d'outil du plugin où il faut cliquer sur Batch

Répondez « Yes » au message d’alerte qui apparait et dit « To use the Batch Optimizer I need to unload the current image. Proceed ? ».
Cliquez sur le bouton « Add images » puis sélectionnez toutes les photos dont vous voulez réduire la taille.
Ensuite choisissez où les photos compressés seront enregistrées en cliquant en bas à droite sur le bouton avec trois petits points :
Fenêtre du Batch avec les boutons à cliquer
Vous pouvez éventuellement cliquer sur le bouton « Settings » et cocher les cases qui vous intéressent (dans mon cas, toutes !)
Il ne reste plus qu’à cliquer sur « Start » et la magie opère…

Les nouvelles photos auront une taille entre 30% et 90% plus petite que les photos d’origine, sans perdre en qualité et en résolution 🙂

2. Si vous souhaitez modifier une seule image

Ouvrez l’image que vous souhaitez optimiser dans IrfanView. Puis faites File > Save for web... (plugin). Si vous avez une alerte qui dit « This file contains a high resolution image. RIOT can handle such images, but processing can be quite slow in this situation. Do you want to resize it first ? (recommanded) The original image won't be modified », alors cliquez sur « No ».

Vous verrez ensuite un comparatif de votre image, avec en haut à droite la taille de la version optimisée : assurez vous que vous avez toujours un chiffre inférieur à la version d’origine !
Selon le format de votre image (JPEG, GIF, PNG), vous avez plusieurs options en bas de la fenêtre.
Prenons l’exemple d’une image PNG : pour la couleur je choisis « Optimal 256 colors », puis dans « External optimizer » je choisis « OptiPNG o3 » (et je clique sur le check vert pour que OptiPNG soit utilisé), et enfin je coche « Best compression ».
Les différentes options choisies dans la Fenêtre d'optimisation
(cliquez sur l’image ci-dessus pour l’agrandir)

Jouez sur les options pour faire varier la taille.

Il ne reste plus qu’à sauver votre travail, et voilà !

Tags: Astuce, howto, Images, Windows

no comment

19

Août

Tester les performances d’un code Javascript via un benchmark [performance]

Posted by Aymeric  Published in Niveau intermédiaire, Performance, Programmation

Je vous conseille de tester régulièrement votre code Javascript pour voir les performances par rapport à d’autres commandes. Il arrive qu’on hésite entre deux (ou plus!) façons de faire.

Il existe le populaire http://jsperf.com/ qui offre la possibilité de tester autant de bouts de code que l’on souhaite, en appelant même quelques framework bien connus (comme jQuery).

Mais si vous avez des besoins un peu plus particulier, ou vous devez travailler sur un environnement restreint, alors il est possible d’utiliser JSLitmus. La façon de l’utiliser est incroyablement simple :

<script src="JSLitmus.js"></script>
<script>
JSLitmus.test('Mon premier test', function() { /* do something */ });
JSLitmus.test('Mon second test', function() { /* do something else */ });
</script>

Cela fait apparaître un bouton « Run tests » avec un petit tableau. Une fois le test fini le tableau et un graphique vous donnent les informations nécessaires, et en l’occurrence plus le chiffre (nombre d’opérations/sec) est grand et mieux c’est.

Voici un exemple qui montre que l’utilisation de search est bien plus rapide que de déclarer une RegExp puis appeler match :

<html>
<head>
<script src="http://www.broofa.com/Tools/JSLitmus/JSLitmus.js"></script>
</head>
<body>
<script>
JSLitmus.test('Mon premier test', function() { var regExp = new RegExp("pouet$"); var ok = ("pouet".match(regExp) != null); });
JSLitmus.test('Mon deuxième test', function() { var ok = ("pouet".search("pouet") != -1); });
</script>
</body></html>

Résultat :

Tags: javascript, Performance, Programmation

no comment

1

Fév

Activer la compression GZip sur WordPress [Performance]

Posted by Aymeric  Published in Astuce, Niveau débutant, Performance

[niveau débutant]

Si vous souhaitez que WordPress serve les pages de votre blog plus rapidement (et surtout en prenant moins de bande passante, c’est-à-dire en pesant moins lourd), vous pouvez utiliser l’option de compression au format GZip. Pour cela il faut simplement ajouter la ligne suivante au début de votre fichier header.php (accessible depuis la partie « Apparence > Editeur » de l’admin de votre blog) :

<?php ob_start(“ob_gzhandler”); ?>

Vous pouvez ensuite vérifier que votre blog utilise bien la compression grâce au site http://www.gidnetwork.com/tools/gzip-test.php, ou en regardant les en-têtes de la page grâce à un plugin Firefox (comme Firebug).

Attention cependant de vérifier que votre hébergeur supporte cette fonctionnalité (ce qui est le cas la plupart du temps).

Source: http://rosedesrochers.todays-woman.net/2010/01/31/how-to-enable-gzip-compression-in-wordpress/

Tags: Astuce, Niveau débutant, Performance, wordpress

2 comments

Me Suivre

Suivre @aymkdn

Catégories

  • À bookmarker
  • Android
  • Application
  • Astuce
  • Debug
  • Divers
  • English
  • Français
  • Images
  • Linux
  • MacOS
  • Navigateur
  • Niveau débutant
  • Niveau expert
  • Niveau intermédiaire
  • Partage
  • Performance
  • Programmation
  • Sécurité
  • Téléphonie
  • Vidéo
  • Web Design
  • Windows

Étiquettes

android Anglais Application Astuce astuces css debian Debug Divers email english facebook firefox Français github IE Images internet explorer javascript jquery Linux mysql Navigateur Niveau débutant Niveau expert Niveau intermédiaire Nokia Partage Performance php Programmation regexp sharepoint Sharepoint 2013 sharepointplus Sécurité traitement vidéo téléphone Téléphonie vidéo Web Design wifi Windows wordpress À bookmarker

Méta

  • Flux RSS
  • Administration

Recent Entries

  • Connect to SharePoint Online using an app clientId and clientSecret
  • Mount a SMB Network Drive with Pivotal Cloud Foundry (pcf) and access it using NodeJS
  • spfx error: No development certificate found. Generate a new certificate manually, or set the `canGenerateNewCertificate` parameter to `true` when calling `ensureCertificateAsync`
  • Deploy a PCF NodeJS app as a scheduled task
  • Power Automate: execute a SQL Query via On-Promise Gateway
  • Pass an URL parameter to a SharePoint Online form’s field
  • Transfer an Alexa AWS Lambda function from the online editor to the ASK CLI
  • Detect mobile in JavaScript
  • Add a domain to a Let’s Encrypt certificate
  • Get email address from a Azure DevOps « by » field in Power Apps Flow

Recent Comments

  • towkneed in Check permissions in Sharepoint based on a PermMas…
  • L in Mise à jour d’un serveur Kimsufi (OVH) depuis D…
  • Aymeric in Utiliser un email alias avec GMail [Astuce]
  • Chris in Utiliser un email alias avec GMail [Astuce]
  • alex91 in Create a self-signed certificate for localhost tes…
  • Coolwriter in Bien configurer eMule [Astuces]
  • Nico in Bien configurer eMule [Astuces]
  • Jim1988 in Permettre le retour en arrière sur une page PHP a…
  • rikimaru11273 in Bien configurer eMule [Astuces]
  • Aymeric in Execute an action before saving a form but after t…
  • Random Selection of Posts

    • How to change the default logon name on Windows 7
    • Simuler un click sur un bouton ou un lien [Programmation]
    • Comment réaliser un bon formulaire HTML [à bookmarker]
    • Update the Toshiba Folio 100 to CyanogenMod 9 (ICS) [Tutorial]
    • Détecter si le Freebox Player est allumé ou éteint (en veille) via les API de Free [Programmation]
    • 10 conseils Facebook pour sa vie privée [A Bookmarker]
    • Ne pas se faire pirater son compte Facebook, sa boîte mail, etc… [Astuce]
© 2008 Kodono is proudly powered by WordPress
Theme designed by Roam2Rome