# future-promise-x

**Repository Path**: xuanzhangran/future-promise-x

## Basic Information

- **Project Name**: future-promise-x
- **Description**: 国内外热门项目、实用工具、便捷插件、开发新范式... 这里可能有你关注的最新动向。❤️本站点由硅谷干货长期更迭，旨在打造一个高质量的大前端开发社区❤️。
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-04-12
- **Last Updated**: 2025-04-12

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

### 参考链接

https://github.com/febobo/web-interview
https://vue3js.cn/interview/webpack/build_process.html
https://juejin.cn/post/7015459058056429599#heading-6
https://cn.vitejs.dev/guide/env-and-mode

[又快又爽的开发 Chrome 扩展程序](https://juejin.cn/post/7041185772300402725)

### LeetCode

```
LeetCode精选TOP 面试题：
/2ckc81c
```

### Profile

```
Monorepo（lerna）
Vitest
Storybook

Docker + Nginx + Jenkins + Gitlab
micro-app + WebComponent
Tauri + Electron 桌面应用
Eslint
Prettier
Husky
lint-staged
sonarqube
```

- react

```
CSS-in-JS(Panda)
styled-components(CSS-in-JS)
react-hook-form
chakra-ui
next
Redux
UnoCSS
TailwindCSS
Bootstrap
react-use
React Router
```

- vue

```
naive-ui
ArcoDesign
vueuse
vue-styled-components
```

### 工作亮点

1. 技术描述：对页面静态资源进行压缩、合并，并使用 CDN 加速，以提高页面动加载速度。
2. 使用 webpack 进行打包优化，包括代码压缩、懒加载和按需加载，以及利用 Tree shaking 等技术来减小包的体积。
3. 优化网络请求：减少不必要的请求次数，合并请求。
4. 采用图片压缩：懒加载和响应式图片等技术，以提高页面加载速度和用户体验。
5. 针对不同浏览器进行测试和调试，处理兼容性问题，确保在各大主流浏览器下的良好兼容性。
6. 通过代码优化：减少不必要的 JavaScripti 和 css 文件大小，进行代码压缩和混淆，以减小加载时间。
7. 将请求逻辑与业务逻辑分离：持续的优化项目，实现代码的可复用性和易维护性。

### 前端编码规范化

1. 项目介绍：负责团队内前端项目编码规范的统一，通过相关 lint 工具的约束与自定义脚手架，实现了针对新增项目一键接入规范，存量项目一键扫描、一键修复已有问题，提升的团队编码质。
2. 功能描述：
   a. 使用 lerna+pnpm 搭建项目甚础结构，实现多 package 代码库的管理；
   b. 根据 markdownlint、commitlint、stylelint、prettier 及 eslint,梳理出团队内部规范，并基于对应 1int 工具定制了相关规则 npm 包，支持项目中直接引用；
   c. 通过 inquirer 和 npm scripts，支持通过 CLI 交互或者命令行的方式选择要使用的 lint 工具；
   d. 支持在 CLI 初始化时，自动获取最新版本号；
   e. 通过 ejs 模板，根据用户输入选型进行 lint 规范的定制渲染，实现一键初始规范化文件的能力；
   f. 通过对项目存量文件的后缀进行筛选，匹配出对应的 lint 所识别的文件并传入给对应 1int 工具，实现一键扫描的能力；
   g. 通过各个 lint 工具的 fi× 属性，实现一键修复存显代码的能力，且统一化 lint 结果的输出，支持各个 lint 工具输出修复后的结果；