用户1811627509256
获得徽章 0
- 前端包括以下几个方面：
用户界面（UI）设计： 前端涉及设计用户界面的外观和感觉，包括页面布局、颜色、图标、字体等。这要求设计师具备良好的视觉和美学意识，以创造吸引人且易于使用的界面。
前端开发： 前端开发人员使用HTML（超文本标记语言）、CSS（层叠样式表）和JavaScript等技术来实现设计师创建的界面。HTML负责定义页面的结构，CSS负责定义样式和布局，JavaScript负责增加交互性和动态性。
响应式设计： 前端开发人员通常还要确保网站或应用程序在不同设备上具有良好的表现，这就是所谓的响应式设计。这意味着界面能够根据用户使用的设备（如手机、平板电脑、桌面电脑）自动调整布局和样式，以适应不同的屏幕尺寸。
用户体验（UX）优化： 前端开发也涉及优化用户体验，以确保用户能够轻松地使用应用程序或网站。这包括确保页面加载速度快、交互流程顺畅，以及提供清晰的导航和反馈等。展开评论点赞 - JavaScript 是一种广泛应用于前端开发的编程语言，而前端框架则是一种帮助开发者更有效地构建用户界面的工具。在 JavaScript 和前端框架中，设计模式是一些被广泛接受和使用的解决问题的经验法则，它们可以提高代码的可维护性、可扩展性和可重用性。评论点赞
- Webpack是一个现代JavaScript应用程序的模块打包工具。它可以将各种资源（如JavaScript、CSS、图片等）打包成一个或多个bundle，以优化加载性能并提供开发时和生产环境的各种功能。评论点赞
- 网页中常用的静态资源：
JS(.js .jsx .coffee .ts(TypeScript中间语言，不能自浏览器中运行，需要编译器进行编译为js语言))
CSS(.css .less .sass -> .scss 类似于.less)
Images(.jpg .png .gif .bmp .svg)
字体文件( .svg .ttf .eot .woff .woff2)
模板文件(.ejs .jade .vue(在webpack中定义的组件方式，推荐使用，每一个.vue文件都是一个组件))展开评论点赞 - 移动浏览器调试工具：
Chrome开发者工具：通过USB连接设备并在Chrome中进行调试，可以检查元素、网络请求、性能等。
Safari开发者工具：类似于Chrome，Safari也提供了开发者工具，可以用于iOS设备的调试。
Firefox开发者工具：Firefox也有移动版开发者工具，用于在Firefox浏览器中进行调试。
移动设备模拟：
调试工具允许模拟不同设备的视口和分辨率，帮助你了解你的应用在不同设备上的显示效果。
针对移动端的CSS媒体查询可以用来适应不同屏幕大小和方向。
远程调试：
使用远程调试工具，如Vorlon.js，可以将你的移动设备连接到PC，然后在PC上远程调试设备上的代码。
一些调试工具允许你在桌面浏览器中实时查看移动设备上的页面。
网络调试：
移动设备上的网络请求可能会受到限制，所以确保你的应用在不同网络条件下都能正常工作。
可以监视网络请求，查看请求和响应头，确保资源加载正确。
调试移动特定问题：
移动设备可能会遇到特定于移动的问题，如触摸事件、移动特定样式等。
使用调试工具检查事件处理、CSS样式和其他移动相关的问题。
移动性能调试：
使用性能分析工具，如Chrome的Lighthouse，来评估网页性能，并提供改进建议。
监视页面加载时间、资源大小和渲染性能。
移动端断点调试：
在JavaScript代码中插入断点，以便在移动设备上调试代码执行过程。
通过调试工具在代码执行时检查变量的值。
移动端console调试：
使用console.log()来输出信息和变量值，以便在移动设备上调试代码。
移动端调试工具和库：
一些库和工具可以帮助你进行移动端调试，如eruda用于移动端的Console、vConsole提供移动端的调试功能、weinre用于远程调试等。
版本兼容性测试：
确保你的应用在不同的移动浏览器和不同版本的移动操作系统上都能正常运行。
针对不同浏览器的样式和交互进行适配。
移动端调试可能因为不同设备、浏览器和操作系统的差异而具有挑战性。因此，熟悉常见的调试工具和技术，并在不同设备上进行测试，是确保移动应用或网页正常工作的重要步骤。展开评论点赞 - 打包问题：Vue脚手架工具vue-cli使用webpack进行打包，开发时可以启动本地开发服务器，实时预览，因为需要对整个项目文件进行打包，开发服务器启动缓慢。
热更新问题：webpack的热更新会以当前修改的文件为入口重新build打包，所有涉及到的依赖也都会被重新加载一次。
vite解决打包问题：vite只启动一台静态页面的服务器，对文件代码不打包，服务器会根据客户端的请求加载不同的模块处理，实现真正的按需加载。
vite解决热更新问题：Vite采用立即编译当前修改文件的办法，同时vite还会使用缓存机制(http缓存=>vite内置缓存)，加载更新后的文件内容，所以，vite具有了快速冷启动、按需编译、模块热更新等优良特质。
Vite在开发模式下不需要打包可以直接运行，使用的是ES6的模块化加载规则；vue-cli开发模式下必须对项目打包才可以运行
vite基于缓存的热更新，vue-cli基于webpack的热更新展开评论点赞 - 1. react- 用于构建用户界面的javaScript 库
发送请求获取数据
处理数据（过滤、整理）
操作dom 呈现页面
react 是一个将数据渲染微HTML视图的开源 JavaScript库
2. facebook开发，且开源
3. 原生JavaScript
原生javaScript操作DOM繁琐、效率低（DOM-APL 操作 UI)。
使用javascript直接操作DOM,浏览器会进行大量的重绘重排。
原生JavaScript没有组件化编码方案，代码复用率低。
4. react 特点
采用组件化模式、声明式编码，提高开发效率及组件复用率。
React Native 中可以使用 React语法进行移动端开发
使用虚拟DOM + 优秀的Diffing算法，尽量减少与真实DOM的交互展开评论点赞