<?xml version="1.0" encoding="utf-8" standalone="yes"?><rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom"><channel><title>Javascript on Gyula's blog</title><link>https://gyk.ro/tags/javascript/</link><description>Recent content in Javascript on Gyula's blog</description><generator>Hugo</generator><language>en-us</language><copyright>&amp;copy; 2017-2024. All rights reserved.</copyright><lastBuildDate>Wed, 20 Dec 2017 14:16:48 +0200</lastBuildDate><atom:link href="https://gyk.ro/tags/javascript/index.xml" rel="self" type="application/rss+xml"/><item><title>My Experience With Tracking by $index</title><link>https://gyk.ro/2017/12/my-experience-with-tracking-by-index/</link><pubDate>Wed, 20 Dec 2017 14:16:48 +0200</pubDate><guid>https://gyk.ro/2017/12/my-experience-with-tracking-by-index/</guid><description>&lt;p>If you found this post while trying to optimize your angular templates, I have a
cautionary tale for you. This might be just me, but this one hurt.&lt;/p>
&lt;p>At work we have an AngularJS application. This application has one particular
list really long, really complex, really grinds the tablets to a halt. How do
you solve that?&lt;/p>
&lt;p>My first tought was, there is too many &lt;code>watch&lt;/code>es in there. One-time bind all the
things. for those of you that dont know one-time binding is done by adding two
colons at the beginnig of the variable name &lt;code>{{::variable}}&lt;/code>. It gets evaluated
once, the first time it has a value, and then angular just forgets about it.&lt;/p></description></item><item><title>xkcd Calendar Fact Generator</title><link>https://gyk.ro/2017/12/xkcd-calendar-fact-generator/</link><pubDate>Wed, 20 Dec 2017 13:12:09 +0200</pubDate><guid>https://gyk.ro/2017/12/xkcd-calendar-fact-generator/</guid><description>&lt;p>So it started with the new &lt;a href="https://xkcd.com/1930/">xkcd&lt;/a> today, I tought &amp;ldquo;this
is easy, I&amp;rsquo;ll be done in an hour&amp;rdquo;.&lt;/p>
&lt;p>Then I went down the rabbit-hole that is customizing Hugo.&lt;/p>
&lt;h1 id="but-first-the-generator">But first the generator&lt;/h1>
&lt;p>You can check it out &lt;a href="https://gyk.ro/random-stuff/xkcd-calendar-facts/">here&lt;/a>&lt;/p>
&lt;p>The application itself is rather simple, it is carried by two functions, calling
each other.&lt;/p>
&lt;p>The first, taking an array, and making a string out of all it&amp;rsquo;s elements&lt;/p>
&lt;div class="highlight">&lt;pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;">&lt;code class="language-js" data-lang="js">&lt;span style="display:flex;">&lt;span>&lt;span style="color:#66d9ef">function&lt;/span> &lt;span style="color:#a6e22e">pickOneOfEach&lt;/span> (&lt;span style="color:#a6e22e">arr&lt;/span>) {
&lt;/span>&lt;/span>&lt;span style="display:flex;">&lt;span> &lt;span style="color:#66d9ef">let&lt;/span> &lt;span style="color:#a6e22e">result&lt;/span> &lt;span style="color:#f92672">=&lt;/span> &lt;span style="color:#e6db74">&amp;#39;&amp;#39;&lt;/span>
&lt;/span>&lt;/span>&lt;span style="display:flex;">&lt;span>
&lt;/span>&lt;/span>&lt;span style="display:flex;">&lt;span> &lt;span style="color:#66d9ef">for&lt;/span> (&lt;span style="color:#66d9ef">let&lt;/span> &lt;span style="color:#a6e22e">el&lt;/span> &lt;span style="color:#66d9ef">of&lt;/span> &lt;span style="color:#a6e22e">arr&lt;/span>) {
&lt;/span>&lt;/span>&lt;span style="display:flex;">&lt;span> &lt;span style="color:#66d9ef">if&lt;/span> (Array.&lt;span style="color:#a6e22e">isArray&lt;/span>(&lt;span style="color:#a6e22e">el&lt;/span>)) {
&lt;/span>&lt;/span>&lt;span style="display:flex;">&lt;span> &lt;span style="color:#a6e22e">result&lt;/span> &lt;span style="color:#f92672">+=&lt;/span> &lt;span style="color:#a6e22e">pickRandom&lt;/span>(&lt;span style="color:#a6e22e">el&lt;/span>)
&lt;/span>&lt;/span>&lt;span style="display:flex;">&lt;span> } &lt;span style="color:#66d9ef">else&lt;/span> {
&lt;/span>&lt;/span>&lt;span style="display:flex;">&lt;span> &lt;span style="color:#a6e22e">result&lt;/span> &lt;span style="color:#f92672">+=&lt;/span> String(&lt;span style="color:#a6e22e">el&lt;/span>) &lt;span style="color:#75715e">// turn everything to string, because .toString() can be unreliable in what it returns
&lt;/span>&lt;/span>&lt;/span>&lt;span style="display:flex;">&lt;span>&lt;span style="color:#75715e">&lt;/span> }
&lt;/span>&lt;/span>&lt;span style="display:flex;">&lt;span> }
&lt;/span>&lt;/span>&lt;span style="display:flex;">&lt;span>
&lt;/span>&lt;/span>&lt;span style="display:flex;">&lt;span> &lt;span style="color:#66d9ef">return&lt;/span> &lt;span style="color:#a6e22e">result&lt;/span>
&lt;/span>&lt;/span>&lt;span style="display:flex;">&lt;span>}
&lt;/span>&lt;/span>&lt;/code>&lt;/pre>&lt;/div>&lt;p>And a second one, getting me a random element from an array&lt;/p></description></item></channel></rss>