Web前端技术日新月异。在巩固基础技能的同时，别忘了跟上前沿技术的发展步伐。本期刊专注于Web前端前端技术。收录内容来自国外各大前端技术周刊。在这里，整理了值得分享的内容。这篇热门文章中的5WaystoAnimateReactAppin2019注意不要错过，我们收集了一系列在React项目中制作动画的好方法。介绍新的ReactDevTools如果您是React开发人员，您应该使用DevTools，因为使用它们可以更快更轻松地导航React。它支持React15及更高版本。BRIANVAUGHN对“CSS-in-JS”的不同看法有些人讨厌CSS-in-JS，因为它混淆了个人意图，而其他人则喜欢它提供的便利。在这里，ChrisCoyier将通过不同职位的实践，为您提供更详细的理解。CSSTRICKSjQuery历史和旧版jQuery在Web开发中可能已经失宠，但它仍然为74%的网站提供支持，并为现代Web框架铺平了道路。DANNYGUOJavaScript和Node测试最佳实践近50个最佳实践，分为：后端、前端、CI等，附有代码示例。它不仅涵盖了基础知识，还涵盖了视觉回归、基于属性的测试和契约测试等领域。YONIGOLDBERG什么是TTFB(TimetoFirstByte)让我们了解一下TTFB在前端性能中的重要性。HARRYROBERTLSLargestContentfulPaint在Chrome77中实现的LargestContentfulPaint(LCP)API宣布了已获得的最大视觉内容元素的渲染时间。您可以从Google的博客了解更多信息。面向全栈开发人员的VSCode扩展列表VSCode扩展有很多，主要面向JavaScript开发人员。有趣的是，由于原始版本在社区中引起争议和争议，作者听取了许多人的建议并重写了它！JONR.CORBIN最小化SVG一位软件工程师告诉您他如何为他的博客优化SVG。VICTORZHOUhttps://victorzhou.com/blog/m...有趣的404关于404，网上有很多有创意的，有用的或者有趣的错误页面：谷歌的Android操作系统错误页面提供了一个有用的列表，popularsuggestionfornextsteps都列出来了，还有一个可爱的小游戏可以玩。设计工具Figma采用与其产品相关的有趣方法——您可以调整屏幕上404文本的一些锚点。在鼓励您进行新搜索的同时，亚马逊使用404页面来展示公司员工的狗。当您刷新页面时，将出现新的狗。如果在NPR网站上迷路了怎么办？404页面会突出显示缺失的人、地点和事物。GitHub的错误页面通过Obi-wanKenobiOctocat和巧妙的悬停效果向《星球大战》致敬。您可以在艺术家SteveLambert的404页面上找到一段令人尴尬的长视频。令我惊讶的是，谷歌（在所有地方）在非常简单的404页面上没有搜索栏。但YouTube确实如此。英国设计咨询公司LaserRed以JohnTravolta的DoYouDareSayAgain为特色，带有有趣的模糊效果。在构建自己的404错误页面时，您可以为用户做任何有价值的事情。包括搜索栏、有用或流行链接列表以及报告错误的方法是一些值得考虑的最佳实践。文章如何使用await/async正确链接多个函数NICHOLASDUNKEL5有趣的JavaScript解构用法构建一个出色的网站是另一回事。让我们看看作者着重于哪三个方面进行了更好的开发设计。ANDREWSPENCER在Sass中处理未使用的CSS以提高性能探索一种面向Sass的解决方案，用于处理未使用的CSS代码，避免涉及无头浏览器和模拟DOM的复杂依赖关系。LUKEHARRISON'Logic-Less'JSXJSX为混合逻辑和标记提供了机会，这是有道理的，但是......你可以走得更远。这篇文章是关于如何保持代码整洁的一些想法。JONATHANVERRECCHIA本机延迟加载已经到来BBC软件工程师讨论了Chrome的新本机延迟加载功能以及他在公司使用该功能的经验。ANDYPOTTS使用scrollIntoView()使新元素出现在溢出容器中。当您浏览页面文档时，您可能没有意识到有些东西在那里。使用scrollIntoView()将使这项任务变得容易。CHRISTIANHEILMANNTailwindCSS简介简要介绍TailwindCSS，一个流行的基于实用程序的CSS库。JOSHUAHALL教程让它动起来：从头开始创建网络动画（视频）如何为网络动画创建和构建图形（使用SVG和JS），以及如何做出或平衡创意和技术决策。CHRISGANNON使用CSS和Splitting.js动画可变字体。这将向您展示如何仅使用CSS为可变字体设置动画，以及如何通过在您的页面上包含Splitting.js（但是您应该用于标题）来动态处理任何大小的文本以使其更容易。CI/CD安全最佳实践可帮助您以多种方式实施CI/CD管道安全标准安全措施。CIRCLECIResourceGradientMagic一个独特的CSS渐变库，您可以通过各种方式更改它，按流行或新的排序。IE11的CSS变量IE11的自定义属性（CSS变量）polyfill。对于已经很慢的浏览器，我不是shim的忠实粉丝，但如果你需要它，它是一个选项。vue-willtable一个可编辑的类似Excel的Vue表格组件。useAuth：使用身份验证平台和Auth0将Auth添加到ReactApp的最简单方法，为您提供许多“开箱即用”的功能。SWIZECTELLERTOOLSAcorn7.0：用纯Javascript编写的微型JavaScript解析器HAVERBEKE、STEPANYAN等。NPKILL：查找并删除旧的或巨大的node_modules文件夹使用此工具删除系统中不需要的node_modules文件夹。ESTEFANíAGARCíAGALLARDO和JUANTORRESGóMEZUIFaces:Avatarsformock-ups如果您需要使用真实用户头像作为ui界面，这些文章可能对您有所帮助。ALEKSANDARTASEVSKI五个用于布局的CSS网格生成器MARIAANTONIETTAPERNA在线图像颜色选择器想要一个调色板来匹配您的图像吗？使用我们的在线颜色选择器找到您的完美html颜色。单击图像以获取HEX、RGB和HSL格式的颜色。EvaDesignSystem深度学习颜色生成器。选择一种主色，应用程序将以此为基础显示各种“语义化”颜色。vue-to-react将Vue组件转换为React组件。OverVue是一个原型制作工具，允许开发人员动态创建和可视化Vue应用程序，实现组件层次结构的实时直观树显示和实时生成的代码预览。快速发布预览版Parcel2.0alpha1：零配置打包工具。V87.7：支持Chrome和Node.js的JS引擎。Jest24.9：流行的JavaScript测试解决方案。Rapha?l2.3：一个跨浏览器的矢量图形库。TUIEditor1.4.6：强大的Markdown所见即所得编辑器。CreateReactApp3.1：“快速启动新ReactApp”的工具。内容来源FrontendFocus：https://frontendfoc.us/JavaScriptWeekly：https://javascriptweekly.com/ResponsiveDesignWeekly：https://responsivedesign.is/WebToolsWeekly：https://webtoolsweekly.com/CSSAnimation周报：https://weekly.cssanimation.r...喜欢的话也可以关注我的微信公众号：zhao-buhan
