Le condensé de matières fraîches du monde du front-end de la dernière semaine n ° 379 (2 - 8 septembre 2019)

Nous portons à votre attention une sélection avec des liens vers de nouveaux matériaux de la zone frontend et autour d'elle.

Médias | Développement Web | CSS | Javascript | Navigateurs | Actualités

---

Médias

• Podcast CSSSR: Nouvelles 512 - Chrome 77, Django 3.0, Plus sur les actions Github, CSS Grid Gantt et Présentation Apple
• Podcast «Frontend Youth (18+)»: # 106 Senior connaît le prix de govnokode
• Podcast Frontend Weekend # 97 : Vsevolod Rodionov sur la façon de construire une carrière de développement au lieu d'une carrière de marin
• Podcast «Devshahta / Night Front End» # 94 : Pavel Malyshev défend et promeut Svelte

Développement Web

• Accordéon, FAQ, spoiler et autres widgets déroulants
• De nouveaux types mikrorazmetki pour des extraits interactifs avancés
• Architecture frontale: Middle Circle
• Apple vient de lancer des composants Web sur la production, et vous l'avez probablement manqué

• Les outils
  • Thème personnalisé dans Chrome DevTools
  • Nouveautés de DevTools (Chrome 78)
  • Débogage TypeScript dans Firefox DevTools
  • Webpack Boilerplate - Chaudière Webpack 4 minimale avec Sass, ESLint, remplacement de module à chaud et optimisation de développement / production
  • 5 conseils pour Firefox DevTools - Inspecteur de stockage
  • Chrome 77 - Nouveautés de DevTools
  • "Outils de mondialisation - L'état du Web." Nouvelle vidéo sur la chaîne des développeurs Google avec Andrei Sitnik en tant qu'invité
  

• La disponibilité
  • Composants inclusifs: changement de thème
  • Vous êtes donc poursuivi pour non-disponibilité
  

• Performances
  • Caractéristiques de Google PageSpeed: amélioration de l'évaluation du site et du classement de recherche
  • Liste de contrôle d'audit de performance Web
  • Performances Web: minimisation de la redistribution DOM / Thrashing de mise en page
  • Pourquoi dois-je précharger la police, même s'il n'y a pas besoin
  

• Les effets
  • Comment changer dynamiquement les couleurs des images de produit en utilisant le mode de mélange CSS et SVG
  • Configurateur pour créer des effets de distorsion personnalisés sur WebGL
  • Sélection créative de sites Web inspirants créatifs - sélection n ° 8
  • Comment créer un visualiseur audio webcam à l'aide de Three.js
  

CSS

• Tout ce que vous devez savoir sur la marge CSS
• Outil de comparaison des frameworks CSS
• Recadrage et perte de données visuelles en CSS
• Comprendre la spécificité CSS
• Utilisation de PostCSS pour automatiser votre flux de travail
• Différentes méthodes pour agrandir un rectangle tout en conservant le rayon de la bordure
• Mon hack CSS préféré
• Variables CSS pour IE11: Real Polyfill pour les propriétés personnalisées dans IE11
• Que font les développeurs CSS et pourquoi sont-ils nécessaires?

Javascript

• Animation de liens dans la barre du navigateur en utilisant JavaScript et emoji
• Les 5 commandements de TypeScript Developer
• Comment optimiser votre application JavaScript avec le service des travailleurs
• Le site devrait-il fonctionner sans JavaScript?
• Obfuscateur JavaScript fait maison simple
• Fonctionnement de JavaScript

• Théorie
  • Utilisation professionnelle du DOM
  • Comment découper des lignes en JavaScript (ES2019)
  • Comment accélérer la déclaration de propagation en JavaScript
  • JavaScript asynchrone: une introduction aux promesses JavaScript
  • 8 habitudes à éviter lors du développement en Javascript
  • Itérateurs et générateurs JavaScript: Itérateurs asynchrones
  

• Réagir
  • 14 conseils pour écrire du code Clean React: Partie 1 , Partie 2
  • Tests basés sur des modèles dans React with State Automata
  • Pourquoi React fait ça?
  • Documentation et aperçu des composants ReactJS avec JSDoc
  • Ajout d'une barre de progression et de notifications à votre application React
  • Migration de JavaScript vers TypeScript sur un vrai projet React
  • React Microfrontends et Monorepos: la combinaison parfaite
  • Tous les rapports avec React Rally 2019
  

• Vue
  • Passer des données à Vue.js - comment ça marche?
  • Crochets dans Vue.js version 3.0
  • Composants fonctionnels de Vue.js: quoi, pourquoi et quand?
  • Expérience de l'utilisation de Vue.js dans "Edil": comment utiliser et pourquoi n'a pas choisi React
  • Comment travailler avec le DOM dans Vue
  • Chargement paresseux de composants Vue et prefetch individuels
  • Marqueurs SVG dynamiques pour Google Maps dans Vue.js
  • Comment utiliser les variables d'environnement dans Vue.js
  • Comment utiliser Google Maps dans les applications sur Vue.js
  • Vue PWA: un exemple d'application Web progressive avec Nuxt
  

• Angulaire
  • Guide du débutant GraphQL avec Angular et Apollo
  • Bouts d'injection de dépendance angulaire
  • Comment utiliser les générateurs de formulaires dans Angular 8 pour valider les formulaires réactifs
  • Partage de composants avec Angular et Bit
  

• Ember
  • Concurrence Ember
  • Commit Porto 19: la prospérité à travers le cycle publicitaire: une histoire d'Ember.js (Ricardo Mendes)
  

• Libs et plugins
  • L'histoire de la façon dont la populaire bibliothèque JavaScript a commencé à afficher des publicités dans le terminal
  • hashids.js - Une petite bibliothèque JS pour générer des identifiants de type YouTube à partir de nombres.
  • O-GL - Cadre WebGL minimaliste
  • spacetime: un utilitaire pour travailler avec les fuseaux horaires
  • Créez des avatars en direct (tels que Animoji) en utilisant face-api.js
  

Navigateurs

• Sortie de Firefox 69
• La mise à jour de Firefox réduira la consommation d'énergie des appareils macOS de trois fois
• Mozilla garantit que les mises à jour de l'API WebExtensions n'endommageront pas les bloqueurs dans Firefox
• Mozilla a commencé à bloquer les cookies pour suivre l'activité des utilisateurs dans Firefox
• Sortie du nouveau navigateur Yandex: musique, notifications, recherche de page
• Les campagnes publicitaires offrent une alternative aux cookies au milieu de l'interdiction de Mozilla sur le suivi des utilisateurs

Divertissant

• Deepfake: comment les réseaux de neurones dépouillent les célébrités et nous rendent fous - et à quel point c'est dangereux
• Facteurs de classement Google 2019 - une étude de Rand Fishkin
• Types d'apprentissage automatique
• En bref sur les polices. Première partie
• Google a ouvert un code de bibliothèque pour le traitement de données confidentielles
• Apple a critiqué le rapport de vulnérabilité de Google sur l'iPhone et a accusé la société de créer l'illusion d'une menace de masse
• Pourquoi ne pas écrire des commentaires dans le code?
A.

Nous nous excusons pour toute faute de frappe ou lien rompu / dupliqué. Si vous remarquez un problème - veuillez écrire dans un e-mail personnel, nous essayons de le résoudre rapidement.

Digeste de la semaine dernière .
Matériel préparé par dersmoll et alekskorovin .