René's URL Explorer Experiment


Title: 前端进阶算法1:如何分析、统计算法的执行效率和资源消耗? · Issue #1 · sisterAn/JavaScript-Algorithms · GitHub

Open Graph Title: 前端进阶算法1:如何分析、统计算法的执行效率和资源消耗? · Issue #1 · sisterAn/JavaScript-Algorithms

X Title: 前端进阶算法1:如何分析、统计算法的执行效率和资源消耗? · Issue #1 · sisterAn/JavaScript-Algorithms

Description: 简介 前端还要学算法?必须学,而且必须狠狠地学。现在去大厂面试,数据结构与算法已经是标配,要是不会的话,那基本与大厂无缘了。 作为一名前端,虽然在平常开发中很少写算法,但当我们需要深入前端框架、开发语言、开源库时,懂算法将大大提高我们看源码的能力。例如 react 的 diff 算法、webpack 中利用 tree-shaking 优化、v8 中的调用栈、消息队列等,这些就大量使用了算法,看懂了就能更好的了解它们的性能,更高效的解决问题,进阶到更高 Level,赚更多...

Open Graph Description: 简介 前端还要学算法?必须学,而且必须狠狠地学。现在去大厂面试,数据结构与算法已经是标配,要是不会的话,那基本与大厂无缘了。 作为一名前端,虽然在平常开发中很少写算法,但当我们需要深入前端框架、开发语言、开源库时,懂算法将大大提高我们看源码的能力。例如 react 的 diff 算法、webpack 中利用 tree-shaking 优化、v8 中的调用栈、消息队列等,这些就大量使用了算法,...

X Description: 简介 前端还要学算法?必须学,而且必须狠狠地学。现在去大厂面试,数据结构与算法已经是标配,要是不会的话,那基本与大厂无缘了。 作为一名前端,虽然在平常开发中很少写算法,但当我们需要深入前端框架、开发语言、开源库时,懂算法将大大提高我们看源码的能力。例如 react 的 diff 算法、webpack 中利用 tree-shaking 优化、v8 中的调用栈、消息队列等,这些就大量使用了算法,...

Opengraph URL: https://github.com/sisterAn/JavaScript-Algorithms/issues/1

X: @github

direct link

Domain: github.com


Hey, it has json ld scripts:
{"@context":"https://schema.org","@type":"DiscussionForumPosting","headline":"前端进阶算法1:如何分析、统计算法的执行效率和资源消耗?","articleBody":"### 简介\r\n前端还要学算法?必须学,而且必须狠狠地学。现在去大厂面试,数据结构与算法已经是标配,要是不会的话,那基本与大厂无缘了。\r\n\r\n作为一名前端,虽然在平常开发中很少写算法,但当我们需要深入前端框架、开发语言、开源库时,懂算法将大大提高我们看源码的能力。例如 react 的 diff 算法、webpack 中利用 tree-shaking 优化、v8 中的调用栈、消息队列等,这些就大量使用了算法,看懂了就能更好的了解它们的性能,更高效的解决问题,进阶到更高 Level,赚更多钱。\r\n\r\n现在市面上的算法资料很多,但针对前端的算法资料少之又少,所以,这里我整理了一份适用于前端的数据结构与算法系列,希望能帮助你从0到1构建完整的数据结构与算法体系。\r\n\r\n本系列预估一共有40多篇,本篇是第一篇。想要更多更快的学习本系列,可以关注公众号「前端瓶子君」和我的「[Github(点击查看)](https://github.com/sisterAn/JavaScript-Algorithms)」\r\n\r\n\r\n\r\n### 一、为什么引入复杂度分析\r\n\r\n我们知道,好的数据结构与算法能够大大缩短代码的执行时间与存储空间,那么我们如何去衡量它喃?本节就主要介绍算法性能的衡量指标—复杂度分析。\r\n\r\n判断一段代码执行的效率最简单最直观的方式就是把它放在机器上执行一遍,自然就会得到算法的执行时间与占用内存大小。那么为什么还要引入复杂度分析喃?\r\n\r\n这主要是因为,通过机器上运行代码来统计算法的性能,有很大的局限性,它容易受测试环境、数据规模影响:\r\n\r\n- 统计结果易受测试环境影响:不同系统、处理器的机器测试结果可能出现很大的不同\r\n- 统计结果易受数据本身、数据规模影响:不同的数据、不同长度的数据都可能对测试结果产生巨大的影响\r\n\r\n而这些都不是我们想要看到的。我们需要的是不受外在因素影响的、大致的估计算法执行效率的方法。这就是使用复杂度分析的原因。\r\n\r\n### 二、如何表示复杂度\r\n\r\n如何表示算法复杂度,具体来讲就是代码执行的时间、执行消耗的存储空间。例如:\r\n\r\n```js\r\nfunction cal(n) {\r\n    let sum = 0; // 1 unit_time\r\n    let i = 0; // 1 unit_time\r\n    for(; i \u003c= n; i++) { // n unit_time\r\n        sum += i; // n unit_time\r\n    }\r\n    return sum\r\n}\r\n```\r\n\r\n从 CPU 的角度看,每段代码不过是读写数据或操作数据,尽管每次操作 CPU 执行的个数、执行的时间都不同,但我们粗咯把每次执行的时间都一致,称为 `unit_time` 。\r\n\r\n所以上述代码总共执行 `(2n+2)*unit_time` 时间,即:`T(n)=(2n+2)*unit_time` ,所以,我们可以写成:\r\n\r\n```js\r\nT(n) = O(f(n))\r\n```\r\n\r\n其中:\r\n\r\n- n:表示数据规模的大小\r\n- f(n):表示每行代码执行的次数总和\r\n- O:表示代码的执行时间 T(n) 与 f(n) 表达式成正比\r\n\r\n当 n 很大时,例如 10000,甚至更大,`T(n) = O(f(n))` 可以表示为 `T(n) = O(n)` 。\r\n\r\n这就是**大 O 时间复杂度表示法**。**大 O 时间复杂度实际上并不具体表示代码真正的执行时间,而是表示代码执行时间随数据规模增长的变化趋势**,所以,也叫作**渐进时间复杂度(asymptotic time complexity)**,简称**时间复杂度**。\r\n\r\n### 三、时间复杂度\r\n\r\n当 n 无限大时,时间复杂度 `T(n)` 受 n 的最高数量级影响最大,与`f(n)` 中的常量、低阶、系数关系就不那么大了。所以我们分析代码的时间复杂度时,仅仅关注代码执行次数最多的那段就可以了。\r\n\r\n看一个例子:\r\n\r\n```js\r\nfunction fun1(n) {\r\n    let sum = 0,i = 0; \r\n    for(; i \u003c= n; i++) {\r\n        sum += i; \r\n    }\r\n    return sum\r\n}\r\nfunction fun2(n) {\r\n    let sum = 0, sum1 = 0, i = 0, j = 0; \r\n    for(; i \u003c= n; i++) { // 循环1\r\n        sum += i; \r\n    }\r\n    for(i = 0; i \u003c= n; i++) { // 循环2\r\n        for(j = 0; j \u003c= n; j++) { \r\n            sum += i * j; \r\n        }\r\n    }\r\n    return sum\r\n}\r\nfunction fun3(n) {\r\n    let sum = 0, i = 0; \r\n    for(; i \u003c= n; i++) { \r\n        sum += fun(i); \r\n    }\r\n    return sum\r\n}\r\n```\r\n\r\n`fun1` 中第1行都是常量,对 n 的影响不大,所以总的时间复杂度要看第2、3行的循环,即时间复杂度为: `O(n)` 。\r\n\r\n`fun2` 中循环1的时间复杂度为 O(n) ,循环2的时间复杂度为 O(n\u003csup\u003e2\u003c/sup\u003e),当 n 趋于无穷大时,总体的时间复杂度要趋于 O(n\u003csup\u003e2\u003c/sup\u003e) ,即上面代码的时间复杂度是 O(n\u003csup\u003e2\u003c/sup\u003e)。\r\n\r\n`fun3` 的时间复杂度是 `O(n * T(fun)) = O(n*n) ` ,即 O(n\u003csup\u003e2\u003c/sup\u003e) 。\r\n\r\n**所以:T(c+n)=O(n),T(m+n)=O(max(m, n)),T(n) = T1(n) T2(m) = O(nm),其中 c 为常量** \r\n\r\n##### 常见复杂度(按数量阶递增)\r\n\r\n**多项式量级:**\r\n\r\n- 常量阶: O(1):当算法中不存在循环语句、递归语句,即使有成千上万行的代码,其时间复杂度也是Ο(1)\r\n- 对数阶:O(logn): 简单介绍一下\r\n\r\n```js\r\nlet i=1;\r\nwhile (i \u003c= n)  {\r\n  i = i * 2;\r\n}\r\n```\r\n\r\n- 每次循环 `i` 都乘以 `2` ,直至 `i \u003e n` ,即执行过程是:2\u003csup\u003e0\u003c/sup\u003e、2\u003csup\u003e1\u003c/sup\u003e、2\u003csup\u003e2\u003c/sup\u003e、…、2\u003csup\u003ek\u003c/sup\u003e、…、2\u003csup\u003ex\u003c/sup\u003e、 n \r\n  所以总执行次数 x ,可以写成 2x = n ,则时间复杂度为 O(log\u003csub\u003e2\u003c/sub\u003en) 。这里是 `2` ,也可以是其他常量 `k` ,时间复杂度也是: O(log\u003csub\u003e3\u003c/sub\u003en) = O(log\u003csub\u003e3\u003c/sub\u003e2 * log\u003csub\u003e2\u003c/sub\u003en) = O(log\u003csub\u003e2\u003c/sub\u003en)\r\n- 线性阶:O(n)\r\n- 线性对数阶:O(nlogn)\r\n- 平方阶、立方阶、….、k次方阶:O(n\u003csup\u003e2\u003c/sup\u003e)、O(n\u003csup\u003e3\u003c/sup\u003e)、…、O(n\u003csup\u003ek\u003c/sup\u003e)\r\n\r\n**非多项式量阶:**\r\n\r\n- 指数阶:O(2\u003csup\u003ek\u003c/sup\u003e)\r\n- 阶乘阶:O(n!)\r\n\r\n### 四、空间复杂度\r\n\r\n时间复杂度表示算法的执行时间与数据规模之间的增长关系。类比一下,空间复杂度表示算法的存储空间与数据规模之间的增长关系。例如:\r\n\r\n```js\r\nfunction fun(n) {\r\n    let a = [];\r\n    for (let i = 0; i \u003c n; i++) {\r\n        a.push(i);\r\n    }\r\n    return a;\r\n}\r\n```\r\n\r\n以上代码我们可以清晰的看出代码执行的空间为 O(1+n) = O(n),即为 i 及数组 a 占用的储存空间。\r\n\r\n所以,空间复杂度分析比时间复杂度分析要简单很多。\r\n\r\n### 五、平均时间复杂度\r\n\r\n时间复杂度受数据本身影响,还分为:\r\n\r\n- 最好时间复杂度:在最理想的情况下,执行这段代码的时间复杂度\r\n- 最坏时间复杂度:在最糟糕的情况下,执行这段代码的时间复杂度\r\n- 平均时间复杂度:所有情况下,求一个平均值,可以省略掉系数、低阶、常量\r\n\r\n### 六、参考资料\r\n\r\n极客时间的数据结构与算法之美\r\n\r\n[学习JavaScript数据结构与算法](https://book.douban.com/subject/26639401/)\r\n\r\n### 七、认识更多的前端道友,一起进阶前端开发\r\n\r\n前端算法集训营第一期免费开营啦🎉🎉🎉,免费哟!\r\n\r\n在这里,你可以和志同道合的前端朋友们(600+)一起进阶前端算法,从0到1构建完整的数据结构与算法体系。\r\n\r\n在这里,瓶子君不仅介绍算法,还将算法与前端各个领域进行结合,包括浏览器、HTTP、V8、React、Vue源码等。\r\n\r\n在这里,你可以每天学习一道大厂算法题(阿里、腾讯、百度、字节等等)或 leetcode,瓶子君都会在第二天解答哟!\r\n\r\n更多福利等你解锁🔓🔓🔓!,关注公众号「前端瓶子君」回复「算法」自动拉你进群","author":{"url":"https://github.com/sisterAn","@type":"Person","name":"sisterAn"},"datePublished":"2020-04-01T04:01:54.000Z","interactionStatistic":{"@type":"InteractionCounter","interactionType":"https://schema.org/CommentAction","userInteractionCount":8},"url":"https://github.com/1/JavaScript-Algorithms/issues/1"}

route-pattern/_view_fragments/issues/show/:user_id/:repository/:id/issue_layout(.:format)
route-controllervoltron_issues_fragments
route-actionissue_layout
fetch-noncev2:1cfbb912-29bb-b0f2-de3a-2c31329bb216
current-catalog-service-hash81bb79d38c15960b92d99bca9288a9108c7a47b18f2423d0f6438c5b7bcd2114
request-idC0F4:F74F6:230A886:2E202AA:696B134F
html-safe-nonce4d5ad1e2e70ab799e9bbd84b4f5e7ff7a46e4fb8b272f4a0db9fb956e59c9a4e
visitor-payloadeyJyZWZlcnJlciI6IiIsInJlcXVlc3RfaWQiOiJDMEY0OkY3NEY2OjIzMEE4ODY6MkUyMDJBQTo2OTZCMTM0RiIsInZpc2l0b3JfaWQiOiI0NzU5OTkyODUxNTM5NjI4ODc5IiwicmVnaW9uX2VkZ2UiOiJpYWQiLCJyZWdpb25fcmVuZGVyIjoiaWFkIn0=
visitor-hmac3d4707411712d2315de798d4581555345d76cdee2a00af281cddfa394270a4fc
hovercard-subject-tagissue:591603641
github-keyboard-shortcutsrepository,issues,copilot
google-site-verificationApib7-x98H0j5cPqHWwSMm6dNU4GmODRoqxLiDzdx9I
octolytics-urlhttps://collector.github.com/github/collect
analytics-location///voltron/issues_fragments/issue_layout
fb:app_id1401488693436528
apple-itunes-appapp-id=1477376905, app-argument=https://github.com/_view_fragments/issues/show/sisterAn/JavaScript-Algorithms/1/issue_layout
twitter:imagehttps://opengraph.githubassets.com/07f8c730c54517813f1de1e1e1676ff87b5aa88d548ad6a0fa1191943a15a068/sisterAn/JavaScript-Algorithms/issues/1
twitter:cardsummary_large_image
og:imagehttps://opengraph.githubassets.com/07f8c730c54517813f1de1e1e1676ff87b5aa88d548ad6a0fa1191943a15a068/sisterAn/JavaScript-Algorithms/issues/1
og:image:alt简介 前端还要学算法?必须学,而且必须狠狠地学。现在去大厂面试,数据结构与算法已经是标配,要是不会的话,那基本与大厂无缘了。 作为一名前端,虽然在平常开发中很少写算法,但当我们需要深入前端框架、开发语言、开源库时,懂算法将大大提高我们看源码的能力。例如 react 的 diff 算法、webpack 中利用 tree-shaking 优化、v8 中的调用栈、消息队列等,这些就大量使用了算法,...
og:image:width1200
og:image:height600
og:site_nameGitHub
og:typeobject
og:author:usernamesisterAn
hostnamegithub.com
expected-hostnamegithub.com
None5f99f7c1d70f01da5b93e5ca90303359738944d8ab470e396496262c66e60b8d
turbo-cache-controlno-preview
go-importgithub.com/sisterAn/JavaScript-Algorithms git https://github.com/sisterAn/JavaScript-Algorithms.git
octolytics-dimension-user_id19721451
octolytics-dimension-user_loginsisterAn
octolytics-dimension-repository_id252061924
octolytics-dimension-repository_nwosisterAn/JavaScript-Algorithms
octolytics-dimension-repository_publictrue
octolytics-dimension-repository_is_forkfalse
octolytics-dimension-repository_network_root_id252061924
octolytics-dimension-repository_network_root_nwosisterAn/JavaScript-Algorithms
turbo-body-classeslogged-out env-production page-responsive
disable-turbofalse
browser-stats-urlhttps://api.github.com/_private/browser/stats
browser-errors-urlhttps://api.github.com/_private/browser/errors
release82560a55c6b2054555076f46e683151ee28a19bc
ui-targetfull
theme-color#1e2327
color-schemelight dark

Links:

Skip to contenthttps://github.com/sisterAn/JavaScript-Algorithms/issues/1#start-of-content
https://github.com/
Sign in https://github.com/login?return_to=https%3A%2F%2Fgithub.com%2FsisterAn%2FJavaScript-Algorithms%2Fissues%2F1
GitHub CopilotWrite better code with AIhttps://github.com/features/copilot
GitHub SparkBuild and deploy intelligent appshttps://github.com/features/spark
GitHub ModelsManage and compare promptshttps://github.com/features/models
MCP RegistryNewIntegrate external toolshttps://github.com/mcp
ActionsAutomate any workflowhttps://github.com/features/actions
CodespacesInstant dev environmentshttps://github.com/features/codespaces
IssuesPlan and track workhttps://github.com/features/issues
Code ReviewManage code changeshttps://github.com/features/code-review
GitHub Advanced SecurityFind and fix vulnerabilitieshttps://github.com/security/advanced-security
Code securitySecure your code as you buildhttps://github.com/security/advanced-security/code-security
Secret protectionStop leaks before they starthttps://github.com/security/advanced-security/secret-protection
Why GitHubhttps://github.com/why-github
Documentationhttps://docs.github.com
Bloghttps://github.blog
Changeloghttps://github.blog/changelog
Marketplacehttps://github.com/marketplace
View all featureshttps://github.com/features
Enterpriseshttps://github.com/enterprise
Small and medium teamshttps://github.com/team
Startupshttps://github.com/enterprise/startups
Nonprofitshttps://github.com/solutions/industry/nonprofits
App Modernizationhttps://github.com/solutions/use-case/app-modernization
DevSecOpshttps://github.com/solutions/use-case/devsecops
DevOpshttps://github.com/solutions/use-case/devops
CI/CDhttps://github.com/solutions/use-case/ci-cd
View all use caseshttps://github.com/solutions/use-case
Healthcarehttps://github.com/solutions/industry/healthcare
Financial serviceshttps://github.com/solutions/industry/financial-services
Manufacturinghttps://github.com/solutions/industry/manufacturing
Governmenthttps://github.com/solutions/industry/government
View all industrieshttps://github.com/solutions/industry
View all solutionshttps://github.com/solutions
AIhttps://github.com/resources/articles?topic=ai
Software Developmenthttps://github.com/resources/articles?topic=software-development
DevOpshttps://github.com/resources/articles?topic=devops
Securityhttps://github.com/resources/articles?topic=security
View all topicshttps://github.com/resources/articles
Customer storieshttps://github.com/customer-stories
Events & webinarshttps://github.com/resources/events
Ebooks & reportshttps://github.com/resources/whitepapers
Business insightshttps://github.com/solutions/executive-insights
GitHub Skillshttps://skills.github.com
Documentationhttps://docs.github.com
Customer supporthttps://support.github.com
Community forumhttps://github.com/orgs/community/discussions
Trust centerhttps://github.com/trust-center
Partnershttps://github.com/partners
GitHub SponsorsFund open source developershttps://github.com/sponsors
Security Labhttps://securitylab.github.com
Maintainer Communityhttps://maintainers.github.com
Acceleratorhttps://github.com/accelerator
Archive Programhttps://archiveprogram.github.com
Topicshttps://github.com/topics
Trendinghttps://github.com/trending
Collectionshttps://github.com/collections
Enterprise platformAI-powered developer platformhttps://github.com/enterprise
GitHub Advanced SecurityEnterprise-grade security featureshttps://github.com/security/advanced-security
Copilot for BusinessEnterprise-grade AI featureshttps://github.com/features/copilot/copilot-business
Premium SupportEnterprise-grade 24/7 supporthttps://github.com/premium-support
Pricinghttps://github.com/pricing
Search syntax tipshttps://docs.github.com/search-github/github-code-search/understanding-github-code-search-syntax
documentationhttps://docs.github.com/search-github/github-code-search/understanding-github-code-search-syntax
Sign in https://github.com/login?return_to=https%3A%2F%2Fgithub.com%2FsisterAn%2FJavaScript-Algorithms%2Fissues%2F1
Sign up https://github.com/signup?ref_cta=Sign+up&ref_loc=header+logged+out&ref_page=%2F%3Cuser-name%3E%2F%3Crepo-name%3E%2Fvoltron%2Fissues_fragments%2Fissue_layout&source=header-repo&source_repo=sisterAn%2FJavaScript-Algorithms
Reloadhttps://github.com/sisterAn/JavaScript-Algorithms/issues/1
Reloadhttps://github.com/sisterAn/JavaScript-Algorithms/issues/1
Reloadhttps://github.com/sisterAn/JavaScript-Algorithms/issues/1
sisterAn https://github.com/sisterAn
JavaScript-Algorithmshttps://github.com/sisterAn/JavaScript-Algorithms
Notifications https://github.com/login?return_to=%2FsisterAn%2FJavaScript-Algorithms
Fork 649 https://github.com/login?return_to=%2FsisterAn%2FJavaScript-Algorithms
Star 5.7k https://github.com/login?return_to=%2FsisterAn%2FJavaScript-Algorithms
Code https://github.com/sisterAn/JavaScript-Algorithms
Issues 158 https://github.com/sisterAn/JavaScript-Algorithms/issues
Pull requests 0 https://github.com/sisterAn/JavaScript-Algorithms/pulls
Actions https://github.com/sisterAn/JavaScript-Algorithms/actions
Projects 0 https://github.com/sisterAn/JavaScript-Algorithms/projects
Security Uh oh! There was an error while loading. Please reload this page. https://github.com/sisterAn/JavaScript-Algorithms/security
Please reload this pagehttps://github.com/sisterAn/JavaScript-Algorithms/issues/1
Insights https://github.com/sisterAn/JavaScript-Algorithms/pulse
Code https://github.com/sisterAn/JavaScript-Algorithms
Issues https://github.com/sisterAn/JavaScript-Algorithms/issues
Pull requests https://github.com/sisterAn/JavaScript-Algorithms/pulls
Actions https://github.com/sisterAn/JavaScript-Algorithms/actions
Projects https://github.com/sisterAn/JavaScript-Algorithms/projects
Security https://github.com/sisterAn/JavaScript-Algorithms/security
Insights https://github.com/sisterAn/JavaScript-Algorithms/pulse
New issuehttps://github.com/login?return_to=https://github.com/sisterAn/JavaScript-Algorithms/issues/1
New issuehttps://github.com/login?return_to=https://github.com/sisterAn/JavaScript-Algorithms/issues/1
前端进阶算法1:如何分析、统计算法的执行效率和资源消耗?https://github.com/sisterAn/JavaScript-Algorithms/issues/1#top
文章https://github.com/sisterAn/JavaScript-Algorithms/issues?q=state%3Aopen%20label%3A%22%E6%96%87%E7%AB%A0%22
https://github.com/sisterAn
https://github.com/sisterAn
sisterAnhttps://github.com/sisterAn
on Apr 1, 2020https://github.com/sisterAn/JavaScript-Algorithms/issues/1#issue-591603641
Github(点击查看)https://github.com/sisterAn/JavaScript-Algorithms
学习JavaScript数据结构与算法https://book.douban.com/subject/26639401/
文章https://github.com/sisterAn/JavaScript-Algorithms/issues?q=state%3Aopen%20label%3A%22%E6%96%87%E7%AB%A0%22
https://github.com
Termshttps://docs.github.com/site-policy/github-terms/github-terms-of-service
Privacyhttps://docs.github.com/site-policy/privacy-policies/github-privacy-statement
Securityhttps://github.com/security
Statushttps://www.githubstatus.com/
Communityhttps://github.community/
Docshttps://docs.github.com/
Contacthttps://support.github.com?tags=dotcom-footer

Viewport: width=device-width


URLs of crawlers that visited me.