{"id":333,"date":"2024-06-12T22:46:19","date_gmt":"2024-06-12T22:46:19","guid":{"rendered":"https:\/\/kurtgrung.com\/blog\/?p=333"},"modified":"2025-05-08T12:13:40","modified_gmt":"2025-05-08T12:13:40","slug":"dry","status":"publish","type":"post","link":"https:\/\/kurtgrung.com\/blog\/dry\/","title":{"rendered":"DRY + fastInverseSquareRoot"},"content":{"rendered":"\n<p>DRY &#8220;Don&#8217;t repeat yourself&#8221; principle. Is probably one of the worst code suggestions, it&#8217;s been taken to the extremes. Stop making abstractions on top of abstractions or even services on top of services.. <br><br>Just like &#8220;CLEAN&#8221; code principle can have huge performance issues at X amount on computing. It&#8217;s easy to lose sight on performance and get caught up on the latest greatest jargons and libraries when they offer little to none over fast and quick way to write code. <br><br>Over-engineered, over bloated code. Should be the biggest reg flag in software design period!<\/p>\n\n\n\n<p>It&#8217;s essential to strike a balance between clean code principles and performance considerations based on the specific requirements of the project. In many cases, clean code and good performance are not mutually exclusive and can be achieved through careful design, optimisation, and testing.<br><br>For example take the <strong>Fast Inverse Square Root<\/strong>, <strong>Fast InvSqrt()<\/strong>, <strong>0x5F3759DF<\/strong>, Algorithm. <br>See more about <a href=\"https:\/\/kurtgrung.com\/blog\/magic\/\">Magic Numbers<\/a>.<br><br>If it wasn&#8217;t for this performance orientated algorithm (and other code snippets from the Quake codebase) the game would never have run as fast and become so legendary.<br><br>The algorithm is a well-known method for approximating the inverse square root of a floating-point number, typically used in computer graphics and game programming for operations involving three-dimensional vectors.<\/p>\n\n\n\n<p>It&#8217;s based on a clever bit manipulation trick and exploits the <strong>IEEE 754<\/strong> floating-point representation to approximate the inverse square root quickly. <br><br>The following code is the fast inverse square root implementation from&nbsp;<em><a href=\"https:\/\/en.wikipedia.org\/wiki\/Quake_III_Arena\" target=\"_blank\" rel=\"noreferrer noopener\">Quake III<\/a><\/em>, stripped of&nbsp;<a href=\"https:\/\/en.wikipedia.org\/wiki\/C_preprocessor\" target=\"_blank\" rel=\"noreferrer noopener\">C preprocessor<\/a>&nbsp;directives, but including the exact original comment text:<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#2e3440ff\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"float q_rsqrt(float number)\n{\n  long i;\n  float x2, y;\n  const float threehalfs = 1.5F;\n\n  x2 = number * 0.5F;\n  y  = number;\n  i  = * ( long * ) &y;                       \/\/ evil floating point bit level hacking\n  i  = 0x5f3759df - ( i &gt;&gt; 1 );               \/\/ what the fuck?\n  y  = * ( float * ) &i;\n  y  = y * ( threehalfs - ( x2 * y * y ) );   \/\/ 1st iteration\n  \/\/ y  = y * ( threehalfs - ( x2 * y * y ) );   \/\/ 2nd iteration, this can be removed\n\n  return y;\n}\" style=\"color:#d8dee9ff;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki nord\" style=\"background-color: #2e3440ff\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #D8DEE9\">float<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #88C0D0\">q_rsqrt<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #D8DEE9\">float<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">number<\/span><span style=\"color: #D8DEE9FF\">)<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #D8DEE9\">long<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">i<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #D8DEE9\">float<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">x2<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">y<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #81A1C1\">const<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">float<\/span><span style=\"color: #D8DEE9FF\"> threehalfs <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> 1<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9FF\">5<\/span><span style=\"color: #D8DEE9\">F<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #D8DEE9\">x2<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">number<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">*<\/span><span style=\"color: #D8DEE9FF\"> 0<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9FF\">5<\/span><span style=\"color: #D8DEE9\">F<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #D8DEE9\">y<\/span><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">number<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #D8DEE9\">i<\/span><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">*<\/span><span style=\"color: #D8DEE9FF\"> ( <\/span><span style=\"color: #D8DEE9\">long<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">*<\/span><span style=\"color: #D8DEE9FF\"> ) <\/span><span style=\"color: #81A1C1\">&amp;<\/span><span style=\"color: #D8DEE9\">y<\/span><span style=\"color: #81A1C1\">;<\/span><span style=\"color: #D8DEE9FF\">                       <\/span><span style=\"color: #616E88\">\/\/ evil floating point bit level hacking<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #D8DEE9\">i<\/span><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">0x5f3759df<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">-<\/span><span style=\"color: #D8DEE9FF\"> ( <\/span><span style=\"color: #D8DEE9\">i<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">&gt;&gt;<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">1<\/span><span style=\"color: #D8DEE9FF\"> )<\/span><span style=\"color: #81A1C1\">;<\/span><span style=\"color: #D8DEE9FF\">               <\/span><span style=\"color: #616E88\">\/\/ what the fuck?<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #D8DEE9\">y<\/span><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">*<\/span><span style=\"color: #D8DEE9FF\"> ( <\/span><span style=\"color: #D8DEE9\">float<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">*<\/span><span style=\"color: #D8DEE9FF\"> ) <\/span><span style=\"color: #81A1C1\">&amp;<\/span><span style=\"color: #D8DEE9\">i<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #D8DEE9\">y<\/span><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">y<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">*<\/span><span style=\"color: #D8DEE9FF\"> ( <\/span><span style=\"color: #D8DEE9\">threehalfs<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">-<\/span><span style=\"color: #D8DEE9FF\"> ( <\/span><span style=\"color: #D8DEE9\">x2<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">*<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">y<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">*<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">y<\/span><span style=\"color: #D8DEE9FF\"> ) )<\/span><span style=\"color: #81A1C1\">;<\/span><span style=\"color: #D8DEE9FF\">   <\/span><span style=\"color: #616E88\">\/\/ 1st iteration<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">  <\/span><span style=\"color: #616E88\">\/\/ y  = y * ( threehalfs - ( x2 * y * y ) );   \/\/ 2nd iteration, this can be removed<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #81A1C1\">return<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">y<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">}<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p>More about it <a href=\"https:\/\/en.wikipedia.org\/wiki\/Fast_inverse_square_root\" target=\"_blank\" rel=\"noreferrer noopener\">here<\/a>. <br><br><br>My version in Javascript for the hell of it <code>:-)<\/code><\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#2e3440ff\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"function fastInverseSquareRoot(x) {\n    let xhalf = 0.5 * x;\n    let i = new Float32Array([x]); \/\/ Convert floating-point number to an integer array\n    i = new Int32Array(i.buffer);  \/\/ Get the integer representation\n\n    i = 0x5f3759df - (i[0] &gt;&gt; 1); \/\/ Initial guess for Newton's method\n    i = new Float32Array(new Int32Array([i]).buffer); \/\/ Convert the integer back to floating-point\n\n    x = i[0] * (1.5 - xhalf * i[0] * i[0]); \/\/ One iteration of Newton's method\n    return x;\n}\n\n\/\/ Example usage\nlet result = fastInverseSquareRoot(4.0);\nconsole.log(result); \n\/\/ outputs: \n\/\/ 0.49915357479239103\" style=\"color:#d8dee9ff;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki nord\" style=\"background-color: #2e3440ff\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #81A1C1\">function<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #88C0D0\">fastInverseSquareRoot<\/span><span style=\"color: #ECEFF4\">(<\/span><span style=\"color: #D8DEE9\">x<\/span><span style=\"color: #ECEFF4\">)<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #81A1C1\">let<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">xhalf<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">0.5<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">*<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">x<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #81A1C1\">let<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">i<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">new<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #88C0D0\">Float32Array<\/span><span style=\"color: #D8DEE9FF\">([<\/span><span style=\"color: #D8DEE9\">x<\/span><span style=\"color: #D8DEE9FF\">])<\/span><span style=\"color: #81A1C1\">;<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #616E88\">\/\/ Convert floating-point number to an integer array<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #D8DEE9\">i<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">new<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #88C0D0\">Int32Array<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #D8DEE9\">i<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">buffer<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><span style=\"color: #D8DEE9FF\">  <\/span><span style=\"color: #616E88\">\/\/ Get the integer representation<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #D8DEE9\">i<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">0x5f3759df<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">-<\/span><span style=\"color: #D8DEE9FF\"> (<\/span><span style=\"color: #D8DEE9\">i<\/span><span style=\"color: #D8DEE9FF\">[<\/span><span style=\"color: #B48EAD\">0<\/span><span style=\"color: #D8DEE9FF\">] <\/span><span style=\"color: #81A1C1\">&gt;&gt;<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">1<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #616E88\">\/\/ Initial guess for Newton&#39;s method<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #D8DEE9\">i<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">new<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #88C0D0\">Float32Array<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #81A1C1\">new<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #88C0D0\">Int32Array<\/span><span style=\"color: #D8DEE9FF\">([<\/span><span style=\"color: #D8DEE9\">i<\/span><span style=\"color: #D8DEE9FF\">])<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #D8DEE9\">buffer<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #616E88\">\/\/ Convert the integer back to floating-point<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #D8DEE9\">x<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">i<\/span><span style=\"color: #D8DEE9FF\">[<\/span><span style=\"color: #B48EAD\">0<\/span><span style=\"color: #D8DEE9FF\">] <\/span><span style=\"color: #81A1C1\">*<\/span><span style=\"color: #D8DEE9FF\"> (<\/span><span style=\"color: #B48EAD\">1.5<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">-<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">xhalf<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">*<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">i<\/span><span style=\"color: #D8DEE9FF\">[<\/span><span style=\"color: #B48EAD\">0<\/span><span style=\"color: #D8DEE9FF\">] <\/span><span style=\"color: #81A1C1\">*<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">i<\/span><span style=\"color: #D8DEE9FF\">[<\/span><span style=\"color: #B48EAD\">0<\/span><span style=\"color: #D8DEE9FF\">])<\/span><span style=\"color: #81A1C1\">;<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #616E88\">\/\/ One iteration of Newton&#39;s method<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9FF\">    <\/span><span style=\"color: #81A1C1\">return<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">x<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">}<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #616E88\">\/\/ Example usage<\/span><\/span>\n<span class=\"line\"><span style=\"color: #81A1C1\">let<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #D8DEE9\">result<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #81A1C1\">=<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #88C0D0\">fastInverseSquareRoot<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #B48EAD\">4.0<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #D8DEE9\">console<\/span><span style=\"color: #ECEFF4\">.<\/span><span style=\"color: #88C0D0\">log<\/span><span style=\"color: #D8DEE9FF\">(<\/span><span style=\"color: #D8DEE9\">result<\/span><span style=\"color: #D8DEE9FF\">)<\/span><span style=\"color: #81A1C1\">;<\/span><span style=\"color: #D8DEE9FF\"> <\/span><\/span>\n<span class=\"line\"><span style=\"color: #616E88\">\/\/ outputs: <\/span><\/span>\n<span class=\"line\"><span style=\"color: #616E88\">\/\/ 0.49915357479239103<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p><br>I created this performance test on <a href=\"https:\/\/jsfiddle.net\/kurtgrung\/ubgcwL0m\/18\/\" target=\"_blank\" rel=\"noreferrer noopener\">jsfiddle<\/a> to further explain the point I am making with all the types of typical javascript Array loops, the traditional Vanilla JS for loop (++) outperforms them all! from 2 milliseconds to 17\/20&#8230;why is it best practice to use Map or Filter in React now? <code>:-) <\/code><\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#2e3440ff\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"&quot;Testing for loop (++)...&quot;\n&quot;Execution time for for loop:&quot;, 2, &quot;milliseconds&quot;\n\n&quot;Testing forEach method (array.forEach())...&quot;\n&quot;Execution time for forEach method:&quot;, 6, &quot;milliseconds&quot;\n\n&quot;Testing for...of loop (for...of)...&quot;\n&quot;Execution time for for...of loop:&quot;, 3, &quot;milliseconds&quot;\n\n&quot;Testing map method (array.map())...&quot;\n&quot;Execution time for map method:&quot;, 17, &quot;milliseconds&quot;\n\n&quot;Testing filter method (array.filter())...&quot;\n&quot;Execution time for filter method:&quot;, 20, &quot;milliseconds&quot;\" style=\"color:#d8dee9ff;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki nord\" style=\"background-color: #2e3440ff\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #ECEFF4\">&quot;<\/span><span style=\"color: #A3BE8C\">Testing for loop (++)...<\/span><span style=\"color: #ECEFF4\">&quot;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">&quot;<\/span><span style=\"color: #A3BE8C\">Execution time for for loop:<\/span><span style=\"color: #ECEFF4\">&quot;<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">2<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">&quot;<\/span><span style=\"color: #A3BE8C\">milliseconds<\/span><span style=\"color: #ECEFF4\">&quot;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">&quot;<\/span><span style=\"color: #A3BE8C\">Testing forEach method (array.forEach())...<\/span><span style=\"color: #ECEFF4\">&quot;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">&quot;<\/span><span style=\"color: #A3BE8C\">Execution time for forEach method:<\/span><span style=\"color: #ECEFF4\">&quot;<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">6<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">&quot;<\/span><span style=\"color: #A3BE8C\">milliseconds<\/span><span style=\"color: #ECEFF4\">&quot;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">&quot;<\/span><span style=\"color: #A3BE8C\">Testing for...of loop (for...of)...<\/span><span style=\"color: #ECEFF4\">&quot;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">&quot;<\/span><span style=\"color: #A3BE8C\">Execution time for for...of loop:<\/span><span style=\"color: #ECEFF4\">&quot;<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">3<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">&quot;<\/span><span style=\"color: #A3BE8C\">milliseconds<\/span><span style=\"color: #ECEFF4\">&quot;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">&quot;<\/span><span style=\"color: #A3BE8C\">Testing map method (array.map())...<\/span><span style=\"color: #ECEFF4\">&quot;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">&quot;<\/span><span style=\"color: #A3BE8C\">Execution time for map method:<\/span><span style=\"color: #ECEFF4\">&quot;<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">17<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">&quot;<\/span><span style=\"color: #A3BE8C\">milliseconds<\/span><span style=\"color: #ECEFF4\">&quot;<\/span><\/span>\n<span class=\"line\"><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">&quot;<\/span><span style=\"color: #A3BE8C\">Testing filter method (array.filter())...<\/span><span style=\"color: #ECEFF4\">&quot;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ECEFF4\">&quot;<\/span><span style=\"color: #A3BE8C\">Execution time for filter method:<\/span><span style=\"color: #ECEFF4\">&quot;<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #B48EAD\">20<\/span><span style=\"color: #ECEFF4\">,<\/span><span style=\"color: #D8DEE9FF\"> <\/span><span style=\"color: #ECEFF4\">&quot;<\/span><span style=\"color: #A3BE8C\">milliseconds<\/span><span style=\"color: #ECEFF4\">&quot;<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p><a href=\"https:\/\/jsfiddle.net\/kurtgrung\/ubgcwL0m\/18\/\" target=\"_blank\" rel=\"noreferrer noopener\">https:\/\/jsfiddle.net\/kurtgrung\/ubgcwL0m\/18\/<\/a><br><br><br>Further reading <a href=\"https:\/\/en.wikipedia.org\/wiki\/Newton%27s_method\" target=\"_blank\" rel=\"noreferrer noopener\">Newton&#8217;s Method<\/a>. <br><br>Or read this <a href=\"https:\/\/kurtgrung.com\/blog\/unconventional-algorithms-hacks-code-for-performance-optimisation\/\" target=\"_blank\" rel=\"noreferrer noopener\">Unconventional algorithms, hacks &amp; code for performance optimisation.<\/a><br><br><strong><br><code>TD;LR ;-) <\/code><\/strong><br><\/p>\n\n\n\n<p><strong>&#8220;CLEAN&#8221;<\/strong> code principle, which stands for principles like clarity, simplicity, maintainability, and readability, does not inherently imply sacrificing performance. In fact, clean code often leads to better performance in the long run because it is easier to understand, maintain, and optimise (but there are pitfalls).<\/p>\n\n\n\n<p>However, there might be scenarios where prioritising clean code over performance could lead to issues, particularly in highly performance-critical systems or in cases where extreme optimisation is required. Here are some potential scenarios where adhering strictly to clean code principles might lead to performance issues:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li><strong>Premature Optimization<\/strong>: Focusing too much on clean code upfront without considering performance requirements might lead to overlooking optimization opportunities. In some cases, it&#8217;s better to write code that works first and then optimise where necessary.<br><\/li>\n\n\n\n<li><strong>Abstraction Overhead<\/strong>: Clean code often involves creating abstractions and layers of indirection for improved maintainability and clarity. However, these abstractions can introduce overhead, especially in performance-critical sections of code.<br><\/li>\n\n\n\n<li><strong>Generality Over Specificity<\/strong>: Writing general-purpose, reusable code may introduce overhead compared to specialized solutions tailored for specific use cases. Clean code often prioritises generality, which might not always align with performance requirements.<br><\/li>\n\n\n\n<li><strong>Avoidance of Low-Level Optimizations<\/strong>: Clean code principles often discourage low-level optimizations or &#8220;micro-optimizations&#8221; in favor of clarity and maintainability. While these optimisations might provide performance benefits, they can also make the code harder to understand and maintain.<br><\/li>\n\n\n\n<li><strong>Excessive Memory Usage<\/strong>: Clean code may emphasize clarity and readability over memory efficiency. In certain cases, this can result in excessive memory usage, which may impact performance, especially in memory-constrained environments.<br><\/li>\n\n\n\n<li><strong>Over-Reliance on Frameworks or Libraries<\/strong>: Clean code encourages the use of frameworks and libraries to promote code reuse and maintainability. However, these dependencies may come with performance overhead, especially if they&#8217;re not optimised for specific use cases.<br><\/li>\n\n\n\n<li><strong>Minimalist Algorithms<\/strong>: Clean code often favours minimalist algorithms that are easier to understand but may not be the most efficient in terms of performance. In some cases, more complex algorithms might be necessary for optimal performance.<\/li>\n<\/ol>\n","protected":false},"excerpt":{"rendered":"<p>DRY &#8220;Don&#8217;t repeat yourself&#8221; principle. Is probably one of the worst code suggestions, it&#8217;s been taken to the extremes. Stop making abstractions on top of abstractions or even services on top of services.. Just like &#8220;CLEAN&#8221; code principle can have huge performance issues at X amount on computing. It&#8217;s easy to lose sight on performance [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[125,114,8],"tags":[124,73,27],"class_list":["post-333","post","type-post","status-publish","format-standard","hentry","category-algorithm","category-best-practice","category-code","tag-algorithm","tag-best-practices","tag-principles"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/kurtgrung.com\/blog\/wp-json\/wp\/v2\/posts\/333","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/kurtgrung.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/kurtgrung.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/kurtgrung.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/kurtgrung.com\/blog\/wp-json\/wp\/v2\/comments?post=333"}],"version-history":[{"count":35,"href":"https:\/\/kurtgrung.com\/blog\/wp-json\/wp\/v2\/posts\/333\/revisions"}],"predecessor-version":[{"id":521,"href":"https:\/\/kurtgrung.com\/blog\/wp-json\/wp\/v2\/posts\/333\/revisions\/521"}],"wp:attachment":[{"href":"https:\/\/kurtgrung.com\/blog\/wp-json\/wp\/v2\/media?parent=333"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/kurtgrung.com\/blog\/wp-json\/wp\/v2\/categories?post=333"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kurtgrung.com\/blog\/wp-json\/wp\/v2\/tags?post=333"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}