Jafeney-CSDN博客

原创 2023年必读的数据清单

《狼书》《精通D3.js 交互式数据可视化高级教程》《Web前端黑客技术揭秘》本文由博客一文多发平台 OpenWrite 发布！

2023-01-01 13:17:11 197 1

随着业务体量和逻辑复杂度的增加，workcenter 对接口的性能耗时有了新的要求，而提升接口性能最有效的方法当然对数据库操作逻辑和SQL语句进行优化了。本篇分享一些数据库性能优化的经验和建议数据库结构优化mysql 逻辑架构图：第一层：客户端通过连接服务，将要执行的 sql 指令传输过来第二层：服务器解析并优化 sql，生成最终的执行计划并执行第三层：存储引擎，负责数据库的存储和提取索引优化索引包含一个或多个列的值。MySql 只能高效的利用索引的最左前缀列。索引的优势在于：.

2021-08-25 23:56:23 222

原创聊聊TypeScript类型声明那些最佳实践

TypeScript 诞生已久，优缺点大家都知晓，它可以说是JavaScript静态类型校验和语法增强的利器，为了更好的代码可读性和可维护性，我们一个个老工程都坦然接受了用TypeScript 重构的命运。然而在改造的过程中，逐步意识到TypeScript这门语言的艺术魅力人狠话不多，下面我们先来聊一下 TypeScript 类型声明相关的技巧：先了解TypeScript的类型系统TypeScript是 JavaScript 的超集，它提供了 JavaScript的所有功能，并在这些功能的基础上附加.

2021-07-04 23:51:52 536 4

原创关于ES6尾调用优化

ES6包含了一个性能领域的特殊要求。这与一个涉及函数调用的特定优化形式相关：即尾调用优化（Tail Call Optimization，TCO）。简单地说，尾调用就是一个出现在另一个函数“结尾”处的函数调用。这个调用结束之后就没有其余事情要做了（除了可能要返回结果值）什么尾调用举个例子，下面是一个非递归的尾调用：function foo(x) { return x}// 尾调用function bar(y) { return foo(y + 1)}// 非尾调用function

2020-09-11 10:30:42 354

原创 CSS常考知识点

本章介绍一下CSS的知识点，CSS的东西很多，下面这些是比较高频的考点，希望对你有所帮助：2.1 常用选择器面试官：请介绍一下常用的选择器及其优先级吧（基础题）在CSS中，选择器是一种模式，用于选择需要添加样式的元素。常用的选择器按优先级从高往低分别是：ID选择器（优先级最高，一般用于定义容器骨架，很少用于样式选择）类选择器（class selectors） (例如.example)、属性选择器（attributes selectors）（例如[type="radio"]

2020-09-07 13:10:44 430

原创 Chrome动画调试最佳实践

前端开发过程中针对复杂的动画，往往调整起来比较无力，这个时候如果借助devTools的Animations工具，就会把复杂的动画变得"有迹可循"。注意：动画检查器支持 CSS 动画、CSS 过渡和网络动画，但暂不支持 requestAnimationFrame 动画面板介绍打开Chrome的devTools面板，点击 x（关闭按钮）左边的更多按钮，选择 "More tools"，然后点击子菜单里的 "Animations"，就可以

2020-09-07 12:47:44 2223

原创 HTML常考知识点

本章先介绍一些HTML最基础的考点，很多大长面试官喜欢由浅入深地考察知识。而对于一些基础问题的回答，很多同学反而因组织不好语言而给面试官留下不好的印象。本章节我们就带大家一一整理和回顾。1.1 DOCTYPE的作用面试官：我们现在写HTML代码第一行通常是 !<DOCTYPE HTML>，请介绍一下DOCTYPE的作用（基础题）DOCTYPE标签是一种标准通用标记语言的文档类型声明，且必须声明在文档的第一行，来告知浏览器用何种文档标准来解析这个网页，不同的渲染模式会影响浏览器对CSS和

2020-09-07 12:46:07 381

原创代码之旅：基础规范

在设计架构的时候，要考虑由下而上的模式，底层的实践最终会影响整个系统的架构。再好的架构，如果没有辅以有效的工程实践，那么最终我们得到的只是一只空有其表的架构方案。能自下而上影响软件架构的，就只有代码了。代码本身是一种难以衡量的实践。同一个业务功能有不同的代码实现。想象一个场景，我们对外提供了一个 RESTful API 接口，是不是只要我们能以规范的方式提供这个RESTful API 接口，代码的实现方式和质量就变得不重要了？从短期来看，如果一个API能快速地提供功能以驱动业务增长，那么它就就是一个成功

2020-08-16 22:04:27 475

原创 JavaScript正则表达式常用技巧

正则表达式是用于匹配字符串中字符组合的模式。在 JavaScript 中，正则表达式也是对象。这些模式被用于 RegExp 的 exec 和 test 方法, 以及 String 的 match、matchAll、replace、search 和 split 方法。正则表达式的掌握程度能粗略地看出程序员的技术底子，所以技术面试、编程竞赛等都特别喜欢考察正则表达式。本篇就带你一起夯实一下 JavaScript 正则表达式的一些使用技巧：创建正则表达式在 JavaScript 的世界，创建正则表达式有.

2020-08-15 17:14:33 693

原创前端架构发展史

最初，前端是没有架构的，因为功能简单的代码毫无架构可言。通过一个简单的jQuery库操作DOM就能完成的工作，无需复杂的设计模式和代码管理机制，也就不需要架构来支持起应用。前端开发的发展历史分为以下几个阶段：古典时代：由后端渲染出前端HTML，用Table布局，用CSS进行简单的辅助动效时代：前端开始编写一些简单的JavaScript脚本来做动画效果，如轮播广告Ajax异步通信时代：2005年，Google在诸多Web应用中使用了异步通信技术如 Google地图，开启了Web前端的一个新时代一

2020-08-02 22:13:51 819

原创 ReactHook快速上车

React16.8开始内置了10个Hook，核心是2个：状态管理：useState副作用管理：useEffect有状态的函数useState有状态组件写法：class Example extends React.Component { constructor(props) { super(props); this.state = { count: 0 }; } render() { return (

2020-05-26 00:29:50 153

原创 Chrome性能调优技巧

在开发大型Web应用或复杂交互的网站，不免会遇到一些页面性能瓶颈的问题。本篇介绍一下如何利用Chrome的性能面板分析网站的性能瓶颈，应该对你有所帮助。注意，为了减少一些Chrome插件对性能评估产生噪音，最好打开隐身模式访问页面进行测试。将Chrome切换到隐身模式，然后打开该页面进行测试： https://googlechrome.github.io/devtools-samples/jank/模拟移动设备与台式机和笔记本电脑相比，移动设备的CPU配置要逊色不少，所以我们测试的时候通常会模

2020-05-25 10:37:32 2220 2

原创移动端适配的最佳实践

移动端适配我们需要做哪些事情? 一个最佳实践除了设置 viewport 和 rem 基准值，随着iPhone手机的不断升级，我们不得不正视以下2个问题：安全区域适配识别刘海屏关于viewpoint-fit在切入正题之前，我们先展开介绍一下viewpoint-fit，它的作用是用于设置可视区域的尺寸，属性如下：PropNameDescriptionNameviewport-fitFor@viewpointValueauto | contaion | cover

2020-05-24 15:02:05 791

原创 Spring Boot 之 Spring Batch 批处理实践

实践内容从 MariaDB 一张表内读 10 万条记录，经处理后写到 MongoDB 。具体实现1、新建 Spring Boot 应用，依赖如下：  <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-web&

2020-05-16 23:43:29 281

原创关于前端面试的一些心得

本系列的目的是帮助更多面试经验不足的前端人才更好地展现自己。在此，我分享一些以往我参加面试和参与招聘的一些心得，希望对大家有帮助。关于简历设计简历是人才的缩影，一份优质的简历是前往大公司的敲门砖。所以对于招聘，简历准备是第一环，也是最重要的一环。前端工程师的简历其实不需要视觉设计类的那般花哨，核心要点是简洁干练，突出重点。简历应该囊括的点招聘人员一般筛查简历时，第一眼关注的时候工作年限和薪资范围（确定是否是能力年龄对路的人才），第二眼看的是学校和学历（985、211、硕士当然最好，如果只是大专，..

2020-05-13 00:20:08 571

原创出给自己的前端面试题（一）

前言这个世界上最了解你的人其实是你自己，所以我觉得最好的面试其实就是自己对自己的刁难和反思。什么是自己真正擅长的领域？什么是自己真正薄弱的地方？什么是自己最恐惧的东西？这些问题往往是一个技术开发者最不愿意正视的，殊不知也正是自己多年来对这些问题的逃避，让自己的技术高度止步于此。接下来，我会不定期更一些“出给自己的前端面试题”和自己给出的解答的相关文章，希望读者能从中获得一些精益，如果回答得不正...

2018-10-09 18:55:12 376

原创随记：关于团队管理的思考

前言今天一大早CTO就找我谈话，主要是为了转正的事。没什么准备啊，就随口做了下总结，和CTO聊天总有一种被打鸡血的感觉。从他的话语中透露着对我的非常高的期望值，这真让我压力山大。不过只字没提“钱”的事，哈哈，有一句话说的好“好的老板和你谈钱，坏的老板和你谈情怀”。这个老板到底是好是坏我还不好太早下结论，但有一点是可以肯定的，职场如战场，CTO能在阿里蛰伏十一年，绝对是个对现实看得比较透彻的人。如果我

2017-11-22 00:06:25 4326 1

原创 ReactNative 到 Weex 的艰难一迈

“Write once，Run Everywhere” 一次编写，多端运行。React迁移到MIT协议，可惜React Native依然没改，没有RN的日子，还好有Weex这位哥们顶着。虽然没有RN那么牛逼，但也算是一个不错的小兄弟。很多人可能要问我搞了这么久的RN现在转Weex干什么？说起来，真是一个悲伤的故事为什么不用RNFacebook并没有像React那样把ReactNative也迁移到

2017-09-29 18:15:43 600

原创 React专利许可证研究

几天前，知乎上出来一个热门话题《如何看待百度要求内部全面停止使用 React / React Native?》，一时间被邀请回答的大咖们就展开了这场没有硝烟的战争。主要有正反两方，跟个大辩论赛似的，很是激烈。我顺道总结下：洗白方洗白方的论据主要有5点：协议一直如此，而且本身是防御性的（1）Facebook的React专利授权是关于分享其代码同时保留它能够抵御的专利诉讼（2）React本身是开源的

2017-09-10 21:44:30 1190 1

原创 React框架精髓

React 搞了2年多了，对这门框架可谓又爱又恨，它的优势大家都熟知，但是缺点也渐渐暴露，一个大型项目里，配合Redux、ReactRouter等三方框架后，结合复杂的业务代码量会变得非常大（前端代码常常是以前的1.5倍）。如果前期底层设计得不好，时常面临着开发效率低的问题。下面归纳了一些React框架的核心概念，希望对大家有帮助：React diff 算法React的diff算法是Virtual

2017-09-03 16:27:59 3284

原创 ReactNative解决方案研究

前言2014年8月，faceBook内部传出用一种新技术开发App的新方案，次年3月，该技术开源并正式发布，它的名字如雷贯耳——“React Native”，我们简称为“RN”。在实现媲美 NativeApp 用户体验的同时，RN允许Web开发者更多地基于现有经验组件化开发App，并且具备跨平台特性，开发效率和成本都相当可观。不过它也有着一般跨平台App共有的短板，就是它的兼容性，尤其是针对国内层

2017-08-11 17:23:03 1217

原创创业后的一些反思

大众创业，万众创新。从大学开始一直有个创业的梦想，去年也终于打开步子去做了。然而这一年下来，从0到1 感受了太大的心酸苦楚，有时克服一个困难紧接着新的麻烦又会接踵而至。在这种高压下奔跑是怎样一种感受，只有经历过的人才会懂。杭州每年都上千个互联网注册，同样也有上百个公司倒闭，以前一直觉得是骇人听闻，现在也渐渐明白过来。创业不是件容易的事，没有任何人，任何理由让你一定能成功，更多的则是失败。细细回想，下

2017-08-03 23:26:43 2422

原创正确的创业理由

创业是一个非常漫长和困难的过程，可能需要十年甚至二十年才能长成参天大树。如果我们创业的理由不正确是不能够支撑我们在这个漫长的过程中持续地走下去的。常见错误的创业理由第一：为了挣钱而创业（90%失败）这是很多人的想法，创业——当老板——想去挣很多很多的钱。他们认为打工赚的钱很有限，认为只有自己当老板才能挣更多的钱，当然这似乎没有错，但也不完全不正确。因为绝大数的创业挣不到钱，甚至还会让你赔很多钱。创

2017-04-30 23:50:30 4003

原创 ReactNative开发常用的三方模块

写在前面一个好的App缺不了好的三方支持，生活在ReactNative这个活跃的开源社区，寻找合适的三方组件是一个开发者最基本的能力。不过不积跬步，无以至千里，不积小流，无以成江海。下面分享几个我收集的三方模块，希望对大家有点帮助。文件上传 react-native-uploadergithub地址：https://github.com/aroth/react-native-uploader 评

2017-03-29 17:01:41 980

原创 CTO养成记（一）CTO理论知识恶补

写在前面天天喊着要当CTO，现在真的当上了，才觉得自己资历太浅，可谓举步维艰。趁着春节几天休息，看了不少文章和书籍，借鉴前人的一些经验，也算是给自己补充点CTO的理论知识。CTO五种基本的必备素质本节选自《我也能做CTO之程序员职业规划》一书（1）超强的学习能力和对技术有浓厚的兴趣和广泛的涉猎。注重软件前沿最新技术潮流，与时消息、与时偕行，与时俱进的方法来提高自身的技术战略眼光与水平。涉猎

2017-01-27 21:55:19 14755 2

原创轮子篇：基于Node和React的全栈式架构

写在前面花几天时间做了个小东西，不得不提，麻雀虽小，但五脏俱全，充分体现出一个全栈工程师在小项目上高效的产出能力 (^-^)。简单介绍下：架构适宜如果你是一个前端开发工程师，并且懂一点Node和数据库。有一天，你的老板逼你快速开发一个移动端的商城加一个管理后台，请不要慌张，装上我的轮子跑跑看。快速搭建本打算弄个脚手架工具，但是出于教学的目的，还是一步步地告诉大家怎么搭这个全栈式的框架。用expres

2016-12-12 21:16:06 11686 5

原创 ReactNative接入微信API

写在前面上一篇简单地讲了 ReactNative 如何接入支付宝支付，那么这一篇就介绍如何接入微信API吧。我们实际用到的一般有微信登录、微信分享、微信支付这三个功能。准备工作微信的东西比较支付宝申请起来要略微麻烦点，步骤多，而且有些资质认证要给微信钱，心太黑。废话不多说，登录微信开放平台，创建你的App应用，改填的都填了，提交 —— 审核1～2天 —— 通过 —— 申请微信支付 —— 继续审核

2016-11-18 17:51:09 8168 3

原创 ReactNative接入支付宝支付

写在前面接入支付宝支付之前，你需要先给你的支付宝商户账号开通APP支付功能。一系列繁琐的申请流程还是要走完的，申请完成后就可以愉快地玩耍了。支付宝配置前端配置接入ReactNativeIOS配置Android配置调试

2016-11-16 16:13:10 14597 12

原创 ReactNative坑点——Date对象正确使用

写在前面昨天遇到了一个非常诡异的场景，ReactNative写的倒计时组件线上版本无法运行，但本地测试却是正常的。我一度以为是ReactNative转换的时候出了问题，不知道从何下手。最后盘查了一圈，发现了一个不得了的事！——ReactNative的JS解析，当打开chrome进行Debug时，用的的确是chrome的内核，但对于转换好的版本，如IOS版本用的是safari的内核，Android版本

2016-11-16 11:25:55 6604 1

原创基于Redux的ReactNative项目开发总结（二）

写在前面自从上次写了此系列的一篇文章，公司App项目不幸被搁浅，我也转战到React组件库和Node后端项目的开发，本来的有些断章取义的想法没有很好地去整合，也就不丢出来献丑了。好在峰回路转，新的ReactNative项目袭来，重拾之前的架构，经过1个月的开发和思考，有丢弃也有创新。版本更新带来的BUG修复faceBook对ReactNative版本的更新速度实在是太快，还记得我开发第一款A

2016-09-20 10:43:27 1347 1

原创 JavaScript异步编程的终极演变

写在前面有一个有趣的问题：为什么Node.js约定回调函数的第一个参数必须是错误对象err(如果没有错误，该参数就是null)? 原因是执行回调函数对应的异步操作，它的执行分成两段，这两段之间抛出的错误程序无法捕获，所以只能作为参数传入第二段。大家知道，JavaScript只有一个线程，如果没有异步编辑，复杂的程序基本没法使用。在ES6诞生以前，异步编程的方式大概有下面四种：回调函数事件

2016-08-16 09:13:14 2417 3

原创基于Node的React图片上传组件实现

写在前面红旗不倒，誓把JavaScript进行到底！今天介绍我的开源项目 Royal 里的图片上传组件的前后端实现原理（React + Node），花了一些时间，希望对你有所帮助。前端实现遵循React 组件化的思想，我把图片上传做成了一个独立的组件（没有其他依赖），直接import即可。import React, { Component } from 'react'import Upload f

2016-08-11 10:38:38 8444 5

原创深入理解React中的上下文this

写在前面JavaScript中的作用域scope 和上下文 context 是这门语言的独到之处，每个函数有不同的变量上下文和作用域。这些概念是JavaScript中一些强大的设计模式的后盾。在ES5规范里，我们可以遵循一个原则——每个function内的上下文this指向该function的调用方。比如：var Module = { name: 'Jafeney', first:

2016-07-19 14:04:31 11725

原创 fetch和XMLHttpRequest讲解

写在前面fetch 同 XMLHttpRequest 非常类似，都是用来做网络请求。但是同复杂的XMLHttpRequest的API相比，fetch使用了Promise，这让它使用起来更加简洁，从而避免陷入”回调地狱”。两者比较比如，如果我们想要实现这样一个需求：请求一个URL地址，获取响应数据并将数据转换成JSON格式。使用fetch和XMLHttpRequest实现的方式是不同的。使用XMLHt

2016-07-17 14:43:57 15091

转载如何十倍提高你的webpack构建效率

前言webpack 是个好东西，和 NPM 搭配起来使用管理模块实在非常方便。而 Babel 更是神一般的存在，让我们在这个浏览器尚未全面普及 ES6 语法的时代可以先一步体验到新的语法带来的便利和效率上的提升。在 React 项目架构中这两个东西基本成为了标配，但 commonjs 的模块必须在使用前经过 webpack 的构建(后文称为 build)才能在浏览器端使用，而每次修改也都需要重新构建

2016-07-10 17:25:44 15918 1

原创深入理解JavaScript的Promise

写在前面对于没有见过的东西，人们会排斥，因为内心会恐惧。 —— 题记对于JavaScript这门语言来说，带P开头的关键词总是给人一种莫名的恐惧感。在初学JavaScript时，对ProtoType 和 __proto__ 非常恐惧，因为初级应用里根本用不到这两位，但是面试官却总喜欢问这类的问题。后来随着

2016-07-03 17:48:39 2031

原创前端框架设计理念

写在前面接下去的一段时间要集中对React和ReactNative的项目做进一步的组件化。我这里也先吹个牛，虽然是小团队，但是我们也决心要搞出一套体系化的东西，暂且把它命名为Royal。动工之前为也做了些理论方面的调研，主要是阿里开发的那套ANT和Twitter的 Bootstrap，作为科学理论基础。十大原则『好设计比差设计更难发现』，因为好设计是如此的自然，帮助用户轻松的完成目标，以至于

2016-07-02 17:06:03 15084 3

转载 Immutable 详解及 React 中实践

写在前面React开发中广泛使用了Immutable，会用但不是很懂，相信很多人有同样的困惑，今天分享一篇知乎的关于 Immutable 的好文章。Shared mutable state is the root of all evil（共享的可变状态是万恶之源）-- Pete Hunt有人说 Immutable 可以给 React 应用带来数十倍的提升，也有人说 Immutable 的引入是

2016-06-26 19:16:18 3609

原创基于Redux的ReactNative项目开发总结（一）

写在前面上周把基于Redux的单页应用开发完紧接着就开始了ReactNative的开发。真的快得不可思议，只花了一周时间，我们两个人就分工把APP也开发完了，并且同时兼容IOS操作系统和Android操作系统。内部测试了一轮，流畅性和用户体验方面也都相当给力！接下去几篇依次介绍项目开发中领悟的技巧和遇到的坑。项目架构和React开发的单页应用不同，ReactNative开发不需要依赖we

2016-06-17 17:09:48 17160 5

原创基于Redux架构的单页应用开发总结（三）

写在前面这篇具体讲讲Redux使用的一些技巧React式编程思维在没有遁入React之前，我是一个DOM操作控，不论是jQuery还是zepto，我在页面交互的实现上用的最多的就是DOM操作，把复杂的交互一步一步通过选择器和事件委托绑定到document上，然后逐个连贯起来。$(document).on('event', 'element', function(e){ e.preve

2016-06-11 17:18:09 2637

空空如也

空空如也