猿急送>

西安前端兼职程序员

ID：409970

夏天

前端

公司信息：
小米

工作经验：
8年

兼职日薪：
700元/8小时

兼职时间：
可工作日远程

所在区域：
西安
全区

技术能力

基础技术：
HTML：结构
CSS：样式，包括CSS3新特性、Flexbox、Grid布局等

开发工具：
版本控制：Git
包管理：npm、yarn、pnpm
构建工具：Webpack、Vite、Rollup等
编译器/转译器：Babel
代码检查：ESLint
格式化：Prettier

JavaScript：核心语言，包括ES6+新特性
框架：vue2 vue3 react
拓展：three d3 cesium openlayer echarts
项目经验：大屏小程序 h5 后台管理

经历过大厂的多人协作项目开发

项目经验

🎯 项目一：智能三维模型编辑平台
项目描述
基于 WebGL 的工业级三维模型可视化与编辑平台，支持多格式模型导入、实时编辑、属性调整和协同设计。

技术栈
前端框架: Vue 3 + TypeScript + Composition API

3D引擎: Three.js + GLTFLoader + OrbitControls

状态管理: Pinia（替代Vuex）

UI组件: Element Plus + 自定义组件库

构建工具: Vite + Rollup

其他: Socket.io（实时通信）、Web Workers（性能优化）

核心职责
架构设计

设计模块化项目结构，实现组件化开发

构建 Three.js 渲染引擎封装层，提供统一API接口

实现 WebGL 资源管理与垃圾回收机制

核心功能开发

typescript
// 模型加载与管理模块
class ModelManager {
private models: Map<string, Model3D>;
private scene: THREE.Scene;

async loadGLBModel(url: string): Promise<Model3D> {
// 实现异步加载、缓存、错误重试机制
}

applyTransform(modelId: string, transform: TransformData) {
// 应用模型变换（位置、旋转、缩放）
}
}
交互功能

拖拽操作: 实现物理级拖拽，支持吸附、碰撞检测

属性编辑: 实时调整模型颜色、材质、透明度

视角控制: 多视角预设、轨道控制器定制

批量操作: 多选、群组、复制粘贴

性能优化

GPU内存管理: 实现模型LOD（细节级别）

渲染优化: 帧率监控、渲染调度

加载优化: 分块加载、渐进式渲染

技术难点与解决方案
大模型加载卡顿

javascript
// 解决方案：分块加载 + Web Workers
const loadLargeModel = async (modelPath) => {
// 主线程：加载基础几何
const baseGeometry = await loadBaseGeometry(modelPath);

// Worker线程：加载细节部分
const detailWorker = new Worker('detail-loader.js');
const details = await workerLoadDetails(modelPath);

// 合并渲染
return mergeGeometry(baseGeometry, details);
};
内存泄漏问题

实现 Three.js 对象生命周期管理

使用 WeakMap 跟踪对象引用

强制垃圾回收机制

跨浏览器兼容性

WebGL 特性检测与降级方案

不同设备性能适配

触摸屏手势支持

项目成果
性能指标: 大模型加载时间减少60%，内存占用降低45%

用户体验: 操作响应时间<100ms，支持100+个模型同时编辑

业务价值: 替代传统桌面软件，客户实施成本降低70%

🎯 项目二：大数据可视化分析平台
项目描述
企业级数据可视化平台，集成多种图表类型，支持实时数据流展示、多维分析和交互式报表。

技术栈
前端框架: React 18 + TypeScript

可视化库: ECharts 5 + D3.js

状态管理: Redux Toolkit + RTK Query

微前端: Qiankun + Module Federation

构建工具: Webpack 5 + Babel

其他: WebSocket、Canvas渲染、WebAssembly

核心职责
可视化引擎开发

定制 ECharts 主题与扩展

开发 Canvas 高性能渲染组件

实现 10+ 种自定义图表类型

数据处理架构

typescript
// 数据流水线设计
class DataPipeline {
private sources: DataSource[];
private transformers: Transformer[];

案例展示

地图开发

CesiumJS 三维地图开发全面指南 📚 CesiumJS 概述 CesiumJS 是一个开源的 JavaScript 库，用于创建基于 WebGL 的三维地球和地图应用。它支持全球地形、卫星影像、3D 建筑、地理数据可视化等功能。 🚀 核心特性特性描述应用场
three开发

CesiumJS 三维地图开发全面指南 📚 CesiumJS 概述 CesiumJS 是一个开源的 JavaScript 库，用于创建基于 WebGL 的三维地球和地图应用。它支持全球地形、卫星影像、3D 建筑、地理数据可视化等功能。 🚀 核心特性特性描述应用场
d3开发

📚 D3.js 概述 D3.js 是一个基于数据操作文档的JavaScript库。它使用HTML、SVG和CSS将数据转换为图形。D3强调Web标准，可以让你拥有数据可视化的完整能力，同时与浏览器技术结合，如SVG、Canvas、CSS等。 🚀 核心特性特性描述应