-
Notifications
You must be signed in to change notification settings - Fork 103
Traduction de avoiding-memory-leaks.md
#156
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Conversation
Merci @maxirozay ! J'étais en vacances, désolé pour l'attente. Je vois que tout le fichier est traduit. Je demande des relectures. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Merci pour la traduction. Je me demande après relectures des premiers paragraphes si tu as eu le temps de relire ta PR avant soumission puisque effectivement tu n'avais indiqué aucun reviewer. Je te laisse nous informer quand tu auras relu ton travail si cela n'est pas le cas. Je poursuivrais ensuite ma relecture et ré-affecterait des reviewers !
Merci à toi !
@@ -1,20 +1,20 @@ | |||
--- | |||
title: Avoiding Memory Leaks (EN) | |||
title: Eviter Les Fuites De Mémoire (FR) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Tu peux retirer le (FR)
Pas de majuscule sur les titres FR
Éviter les fuites de mémoire
type: cookbook | ||
order: 10 | ||
--- | ||
|
||
## Introduction | ||
|
||
<p>Cette page est en cours de traduction. Pour nous aider, vous pouvez participer sur <a href="https://github.com/vuejs-fr/vuejs.org" target="_blank">le dépôt GitHub dédié de Vuejs-FR</a>.</p><p>If you are developing applications with Vue, then you need to watch out for memory leaks. This issue is especially important in Single Page Applications (SPAs) because by design, users should not have to refresh their browser when using an SPA, so it is up to the JavaScript application to clean up components and make sure that garbage collection takes place as expected.</p> | ||
<p>Si vous développer des applications avec Vue, vous devez être attentif aux fuites de mémoire. Ce problème est spécialement important dans les Single Page Applications (SPAs) car par design, les utilisateurs ne devrait pas avoir à rafraîchir leur navigateur quand ils utilisent une SPA. L'application JavaScript est responsable pour le nettoyage des composants et doit s'assurer que le garbage collector fonctionne correctement.</p> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Tu peux retirer les <p>...</p>
(pas le contenu)
type: cookbook | ||
order: 10 | ||
--- | ||
|
||
## Introduction | ||
|
||
<p>Cette page est en cours de traduction. Pour nous aider, vous pouvez participer sur <a href="https://github.com/vuejs-fr/vuejs.org" target="_blank">le dépôt GitHub dédié de Vuejs-FR</a>.</p><p>If you are developing applications with Vue, then you need to watch out for memory leaks. This issue is especially important in Single Page Applications (SPAs) because by design, users should not have to refresh their browser when using an SPA, so it is up to the JavaScript application to clean up components and make sure that garbage collection takes place as expected.</p> | ||
<p>Si vous développer des applications avec Vue, vous devez être attentif aux fuites de mémoire. Ce problème est spécialement important dans les Single Page Applications (SPAs) car par design, les utilisateurs ne devrait pas avoir à rafraîchir leur navigateur quand ils utilisent une SPA. L'application JavaScript est responsable pour le nettoyage des composants et doit s'assurer que le garbage collector fonctionne correctement.</p> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
développer => développez
Single Page Applications => applications monopages (« SPAs »)
car par design => je proposerais « car de par leur conception »
devrait => devraient
est responsable pour le nettoyage => est responsable du nettoyage
garbage collector => ramasse-miettes
|
||
Memory leaks in Vue applications do not typically come from Vue itself, rather they can happen when incorporating other libraries into an application. | ||
Les fuites de mémoire dans les applications Vue ne viennent pas de Vue, elles peuvent arriver quand on ajoute d'autre librairies dans une application. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
d'autre librairies => d'autres bibliothèques (library = bibliothèque)
|
||
## Simple Example | ||
## Simple Exemple |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Simple exemple
Ou
Exemple simple
(Pas de majuscule)
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Je mettrais juste Exemple
. J'éviterais d'utiliser le mot simple de par l'idée de facilité qu'il véhicule. Ce n'est pas forcément simple pour des débutants.
Des avis à ce propos?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Donc on ne laisse pas les majuscules comme dans la version anglaise?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Jamais sur les titres français (enfin si il y a des cas possibles, mais pas dans nos traductions).
|
||
The following example shows a memory leak caused by using the [Choices.js](https://github.com/jshjohnson/Choices) library in a Vue component and not properly cleaning it up. Later, we will show how to remove the Choices.js footprint and avoid the memory leak. | ||
L'exemple suivant montre une fuite de mémoire causée par l'utilisation de la librairie [Choices.js](https://github.com/jshjohnson/Choices) dans un composant Vue et pas proprement nettoyée. Plus tard on va vous montrer comment enlever l'empreinte de Choices.js et éviter les fuites de mémoire. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
bibliothèque
dans un composant Vue qui n'est pas proprement nettoyé.
Plus tard on va vous montrer comment => Plus tard nous verrons comment
@@ -1,20 +1,20 @@ | |||
--- | |||
title: Avoiding Memory Leaks (EN) | |||
title: Eviter Les Fuites De Mémoire (FR) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Je mettrais: Éviter les fuites de mémoire
type: cookbook | ||
order: 10 | ||
--- | ||
|
||
## Introduction | ||
|
||
<p>Cette page est en cours de traduction. Pour nous aider, vous pouvez participer sur <a href="https://github.com/vuejs-fr/vuejs.org" target="_blank">le dépôt GitHub dédié de Vuejs-FR</a>.</p><p>If you are developing applications with Vue, then you need to watch out for memory leaks. This issue is especially important in Single Page Applications (SPAs) because by design, users should not have to refresh their browser when using an SPA, so it is up to the JavaScript application to clean up components and make sure that garbage collection takes place as expected.</p> | ||
<p>Si vous développer des applications avec Vue, vous devez être attentif aux fuites de mémoire. Ce problème est spécialement important dans les Single Page Applications (SPAs) car par design, les utilisateurs ne devrait pas avoir à rafraîchir leur navigateur quand ils utilisent une SPA. L'application JavaScript est responsable pour le nettoyage des composants et doit s'assurer que le garbage collector fonctionne correctement.</p> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
- développez
- ne devraient
- rafraichir (graphie rectifiée)
|
||
Memory leaks in Vue applications do not typically come from Vue itself, rather they can happen when incorporating other libraries into an application. | ||
Les fuites de mémoire dans les applications Vue ne viennent pas de Vue, elles peuvent arriver quand on ajoute d'autre librairies dans une application. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
- d'autres
|
||
In the example below, we load up a select with a lot of options and then we use a show/hide button with a [v-if](/v2/guide/conditional.html) directive to add it and remove it from the virtual DOM. The problem with this example is that the `v-if` directive removes the parent element from the DOM, but we did not clean up the additional DOM pieces created by Choices.js, causing a memory leak. | ||
Dans l'exemple ci-dessous, on ajoute énormément d'options dans un select et ensuite on utilise un montrer/cacher bouton avec une directive [v-if](/v2/guide/conditional.html) pour l'ajouter et l'enlever de la DOM virtuel. Le problème avec cet exemple est que la directive `v-if` enlève l'élément parent de la DOM, mais on ne nettoie pas les pièces additionnel de la DOM crées par Choices.js, ce qui crée une fuite de mémoire. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
- additionnelles
- créées
@@ -76,15 +76,15 @@ new Vue({ | |||
}) | |||
``` | |||
|
|||
To see this memory leak in action, open this [CodePen example](https://codepen.io/freeman-g/pen/qobpxo) using Chrome and then open the Chrome Task Manager. To open the Chrome Task Manager on Mac, choose Chrome Top Navigation > Window > Task Manager or on Windows, use the Shift+Esc shortcut. Now, click the show/hide button 50 or so times. You should see the memory usage in the Chrome Task Manager increase and never be reclaimed. | |||
Pour voir cette fuite de mémoire en action, ouvrer [l'exemple CodePen](https://codepen.io/freeman-g/pen/qobpxo) avec Chrome et ensuite ouvrer le gestionnaire de tâches de Chrome. Pour ouvrir le gestionnaire de tâches sur Mac, cliquer sur Fenêtre > Gestionnaire de Tâches ou sur Windows, utiliser le raccourcis Shift+Esc. Maintenant, cliquer sur le montrer/cacher bouton à peu prêt 50 fois. Vous deviez voir l'utilisation de la mémoire qui dans le gestionnaire de tâches de Chrome qui augmente sans jamais être nettoyer. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
- ouvrez (2x)
- raccourci
- à peu près
|
||
We have discussed managing memory when removing elements, but what if you intentionally want to preserve state and keep elements in memory? In this case, you can use the built-in component [keep-alive](/v2/api/#keep-alive). | ||
Nous avons discuté de la gestion de mémoire quand on enlève des éléments, mais qu'arrive-il quand on veut intentionnellement garder l'état et les éléments dans la mémoire? Dans ce cas, on peut utiliser le composant [keep-alive](/v2/api/#keep-alive). |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
- qu'arrive-t-il
|
||
When you wrap a component with `keep-alive`, its state will be preserved and therefore kept in memory. | ||
Quand on enveloppe un composant avec `keep-alive`, son état est préservé et donc garder en mémoire. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
- gardé
Vue permet de facilement développer de magnifiques, réactives applications JavaScript, mais vous devez toujours faire attention aux fuites de mémoire. Ces fuites vont souvent survenir quand on utilise des libraires additionnel qui manipule la DOM en dehors de Vue. Soyez sure de tester votre application pour les fuites de mémoire et faites attention de bien nettoyer vos composants si nécessaire. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
- des librairies additionnelles qui manipulent
|
||
## Simple Example | ||
## Simple Exemple |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
- Exemple
J'éviterais d'utiliser le mot simple
de par l'idée de facilité qu'il véhicule. Ce n'est pas forcément simple pour des débutants.
|
||
```js | ||
beforeDestroy: function () { | ||
this.choicesSelect.destroy() | ||
} | ||
``` | ||
|
||
## Alternative Patterns | ||
## Modèle Altérnatif |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
- Modèles alternatifs
Bon pour moi, j'hésitais aussi
Le lun. 3 sept. 2018 à 12:07, Julien Grünhagel <notifications@github.com> a
écrit :
… ***@***.**** commented on this pull request.
------------------------------
In src/v2/cookbook/avoiding-memory-leaks.md
<#156 (comment)>:
>
-## Simple Example
+## Simple Exemple
Je mettrais juste Exemple. J'éviterais d'utiliser le mot simple de par
l'idée de facilité qu'il véhicule. Ce n'est pas forcément simple pour des
débutants.
Des avis à ce propos?
—
You are receiving this because your review was requested.
Reply to this email directly, view it on GitHub
<#156 (comment)>,
or mute the thread
<https://github.com/notifications/unsubscribe-auth/ADs8uUSO9bJWaNLyrTLbwdCCMp_pSINdks5uXP9MgaJpZM4WTUGr>
.
|
Désolé je n'avais effectivement pas relu. Je viens de faire un relecture en prenant en compte vos commentaires. |
4758f86
to
92f9040
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Certaines corrections non-relevées/non-corrigées
@@ -76,15 +76,15 @@ new Vue({ | |||
}) | |||
``` | |||
|
|||
To see this memory leak in action, open this [CodePen example](https://codepen.io/freeman-g/pen/qobpxo) using Chrome and then open the Chrome Task Manager. To open the Chrome Task Manager on Mac, choose Chrome Top Navigation > Window > Task Manager or on Windows, use the Shift+Esc shortcut. Now, click the show/hide button 50 or so times. You should see the memory usage in the Chrome Task Manager increase and never be reclaimed. | |||
Pour voir cette fuite de mémoire en action, ouvrez [l'exemple CodePen](https://codepen.io/freeman-g/pen/qobpxo) avec Chrome et ensuite ouvrez le gestionnaire de tâches de Chrome. Pour ouvrir le gestionnaire de tâches sur Mac, cliquer sur Fenêtre > Gestionnaire de Tâches ou sur Windows, utiliser le raccourci Shift+Esc. Maintenant, cliquer sur le bouton montrer/cacher à peu près 50 fois. Vous devriez voir l'utilisation de la mémoire dans le gestionnaire de tâches de Chrome qui augmente sans jamais être nettoyer. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
- nettoyée
|
||
Memory management and performance testing can easily be neglected in the excitement of shipping quickly, however, keeping a small memory footprint is still important to your overall user experience. | ||
La gestion de la mémoire et les testes de performance peuvent facilement être négligés dans l'envie de livrer rapidement, néanmoins, utiliser peu de mémoire est toujours important pour l'expérience utilisateur. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
- tests
|
||
```js | ||
beforeDestroy: function () { | ||
this.choicesSelect.destroy() | ||
} | ||
``` | ||
|
||
## Alternative Patterns | ||
## Modèle altérnatifs |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
- Modèles alternatifs (sans accent et les deux mots au pluriel)
|
||
Once you use keep-alive, then you have access to two more lifecycle hooks: `activated` and `deactivated`. If you do want to clean up or change data when a keep-alive component is removed, you can do so in the `deactivated` hook. | ||
Quand on utilise kee-alive, on a accès à deux lifecycle hooks de plus: `activated` et `deactivated`. Si on veut nettoyer ou changer les données quand un keep-alive composant est enlevé, on peut le faire dans le hook `deactivated`. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
- keep-alive (manque un
p
)
Vue permet de facilement développer de magnifiques, réactives applications JavaScript, mais vous devez toujours faire attention aux fuites de mémoire. Ces fuites vont souvent survenir quand on utilise des bibliothèques additionnel qui manipulent la DOM en dehors de Vue. Soyez sure de tester votre application pour les fuites de mémoire et faites attention de bien nettoyer vos composants si nécessaire. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
- additionnelles
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
2 petites remarques et c'est du beau boulot. Bravo !
|
||
The following example shows a memory leak caused by using the [Choices.js](https://github.com/jshjohnson/Choices) library in a Vue component and not properly cleaning it up. Later, we will show how to remove the Choices.js footprint and avoid the memory leak. | ||
L'exemple suivant montre une fuite de mémoire causée par l'utilisation de la bibliothèque [Choices.js](https://github.com/jshjohnson/Choices) dans un composant Vue et pas proprement nettoyée. Plus tard nous verrons comment enlever l'empreinte de Choices.js et éviter les fuites de mémoire. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
je remplacerais "dans un composant Vue et pas proprement nettoyée." par "dans un composant Vue où le nettoyage n'est pas fait proprement."
Je trouve cela plus français
|
||
Consider the types of devices your users may be using and what their normal flow will be. Could they use memory constrained laptops or mobile devices? Do your users typically do lots of in-application navigation? If either of these are true, then good memory management practices can help you avoid the worst case scenario of crashing a user’s browser. Even if neither of these are true, you can still potentially have degradation of performance over extended usage of your app if you are not careful. | ||
Considérer les types d'appareils que vos utilisateurs peuvent utiliser et quelle utilisation en font-ils. Utilisent-ils des ordinateurs portables avec peu de mémoire ou des appareils mobiles? Est-ce qu'ils font beaucoup de navigation à l'intérieur de votre application? Si c'est le cas, une bonne gestion de la mémoire peut aider à éviter de crasher le navigateur de l'utilisateur. Même si ce n'est pas le cas, vous pouvez toujours avoir une dégradation des performances sur une longue période d'utilisation de votre app si vous ne faites pas attention. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Avant chaque point d'interrogation, il faut ajouter un espace.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Je veux bien le faire mais pourquoi? La version anglaise et les autres caractères de ponctuation n'a pas d'espace et je n'ai pas l'habitude de mettre des espaces avant un point d'interrogation.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
En français, avant un ?, ! ou : il doit y avoir un espace, toutes les traductions faites jusqu'à présent appliquent cette règle. Merci
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Quelle est ta langue maternelle @maxirozay ?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
En fait pour info: en Suisse, il est recommandé d'insérer un espace fine insécable (et non pas un espace simple comme en France) devant les signes de ponctuation doubles mais l'omission de ce dernier est la norme (difficile à ajouter sans micro-typo).
Edit:
Il est recommandé d'utiliser un espace fine insécable devant les signes de ponctuation doubles. En suisse la norme est de ne pas mettre d'espace si l'on ne peut pas mettre un espace fine insécable (qu'on ajoute seulement lors de la micro-typo pour une édition p.e.) tandis qu'en France la norme est de mettre un espace insécable à la place.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Ce qui m'emmène à la question suivante: est-ce qu'on créerait un petit repo genre "Guidelines" avec les différentes règles de traduction de la communauté, les traductions des mots techniques, etc.?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Ok pas de problème alors.
@haeresis ma langue maternelle est le français (de Suisse).
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
avoiding-memory-leaks.md
No description provided.