The recent issue of our weekly front-end digest includes themed sites with Css Variables, 3 superpowers of the Flex-Box model, Angular 5 vs. React vs. Vue, infinite scroll techniques in React, Chrome 65 Beta, and more. Keep on reading!
Web Development
• Front-end Frameworks: Custom vs Ready-to-use Solutions
• Another reason to use noopener – A deep dive into renderer process allocation
- Performance:
• Web Perf Optimization with webpack: Reduce front-end code size and Monitor it to stay fast. Brand new guides from @iamakulov & @addyosmani
• How SEOs Can Benefit From Google Lighthouse – Website Performance Metrics
• Taking A Look At The State Of Progressive Images And User Perception
• Website Performance and the Crawl Budget
• How we made our page-load optimizations even faster
• Optimize your MP4 video for better performance
- AMP/PWA:
• PWA on desktop
• Service workers: the little heroes behind Progressive Web Apps
• Google AMP & WordPress: Everything You Need to Know
• Welcoming Progressive Web Apps to Microsoft Edge and Windows 10
- Tools:
• hreftools – Online web tools to get your work done faster.
• Launching SEO Audit category in Lighthouse Chrome extension
• Webpack to Parcel: a create-react-app migration
• Learn, Teach, Work and Play in the Web Assembly Studio
- Accessibility:
• aria-label is a xenophobe
• My Accessibility Journey: What I’ve Learned So Far
• Accessibility Interview Questions
• Simplifying the New WCAG 2.1 Guidelines
- Animations:
• CSS-Only Cube Pack, based on an animation by Joseph Ryba
• Only CSS: Infinite Steps
• Slice Revealer. A reveal effect where animated slices cover and uncover an image.
• Direction Aware Hover Effects
• Winamp2-js
CSS
• CSS Code Can Be Abused to Collect Sensitive User Data
• Using Media Queries For Responsive Design In 2018
• Modern CSS Explained For Dinosaurs
• Using Conic Gradients and CSS Variables to Create a Doughnut Chart Output for a Range Input
• Building Themed Sites with CSS Variables
• Counting With CSS Counters and CSS Grid
• modern-normalize – modern-normalize – normalize browsers’ default style
• 3 Superpowers of the Flex-Box Model — How flex-basis, flex-shrink and flex-grow work.
• Internet Explorer exists. Use CSS Grid?
JavaScript
• Learn to spot red flags in your React/JavaScript code
• An Overview of JavaScript Testing in 2018
• Five Common Problems in GraphQL Apps (And How to Fix Them)
• JavaScript Frameworks by the Numbers — Winter 2018
• Angular 5 vs. React vs. Vue
• Using Default Parameters in ES6
• Private Variables in JavaScript
- VueJS:
• Building a Simple Face Recognition App with Vue.js and Kairos
• Vue on 2018 — Interview with Evan You, author of the Vue.js framework
- React:
• What’s new in React 16.3(.0-alpha)
• Infinite scroll techniques in React
• Evolving Patterns in React
• Introducing React Scope – Visualize Your React Components as You Interact With Your App
• React’s new Context API
- Angular:
• Run Angular CLI repos directly in your browser
• Getting started with Angular SDK
Browsers
• Here’s how Google Chrome’s new ad blocker works
• Opera 51 comes with improved browsing speed
• Chrome 65 Beta: CSS Paint API and the ServerTiming API
This post first appeared on Web Design And Development Blog | Zfort Group, please read the originial post: here