11-2-2018:

1. – Can’t have a milliseconds timer in javascript: https://stackoverflow.com/questions/7648557/setinterval-behaviour-with-0-milliseconds-in-javascript/7648619#7648619
2. Historic moment from 2010: “This is mainly a notice to the Bitcoin community that the article about Bitcoins on Wikipedia is being deleted….The reason for the deletion is non-notability. In other words, nobody outside of the Bitcoin community is really paying attention to the currency or saying much about it.” https://bitcointalk.org/index.php?topic=342.msg4157#msg4157
3. Bitcoin first release: https://www.mail-archive.com/cryptography@metzdowd.com/msg10142.html
4. Hal finney summarizes the first 4 years of bitcoin: https://bitcointalk.org/index.php?topic=155054.0
5. Nick Szabo is Satoshi Nakamoto? https://www.reddit.com/r/Bitcoin/comments/71memx/why_i_think_nick_szabo_is_satoshi_nakamoto/
6. Boomerang – SOAP & REST Client which can help easily perform requests to web services such as TFS web service: https://chrome.google.com/webstore/detail/boomerang-soap-rest-clien/eipdnjedkpcnlmmdfdkgfpljanehloah/
7. Changing TFS max attachment size requires a soap request which can be performed by using chrome boomerang extension: https://docs.microsoft.com/en-us/vsts/work/customize/reference/change-maximum-attachment-size-work-items
8. Javascript gotchas: https://hackernoon.com/js-wtf-with-math-79da9a941ec1

25-1-2018:

1. Good to know repositories for net core developers: https://github.com/dotnet-architecture
2. Net core scoping gotchas:
   1. https://blog.markvincze.com/two-gotchas-with-scoped-and-singleton-dependencies-in-asp-net-core/
   2. http://docs.autofac.org/en/latest/lifetime/captive-dependencies.html
3. Good to know js info: https://stackoverflow.com/questions/2485632/valueof-vs-tostring-in-javascript
4. Cool js trick which helps understand js better: https://codeburst.io/javascript-can-a-1-a-2-a-3-ever-evaluate-to-true-aca13ff4462d

8-1-2018:

1. Chrome released headless mode and caused phantomjs to die https://groups.google.com/forum/#!msg/phantomjs/9aI5d-LDuNE/5Z3SMZrqAQAJ
2. Searching information about certificates: https://crt.sh/
3. Adaptation of PWA concepts continue. Microsoft announced earlier in 2017 that it adopts it and recently apple announced it starts implementing service workers.
4. Flutter by google might be the next big thing in cross platform app development. It allows to have one codebase for ios and android with superb performance, better than that of react native and cordova https://codeburst.io/googles-flutter-react-java-swing-8174c8d9d402

26-8-2017:

1. Tab napping vulnerability to be aware of: https://www.jitbit.com/alexblog/256-targetblank—the-most-underestimated-vulnerability-ever/
2. Major performance improvements in net core 2 of stuff like .ToArray, .IndexOf and more: https://blogs.msdn.microsoft.com/dotnet/2017/06/07/performance-improvements-in-net-core/
3. I recently noticed something weird in chrome where element css rules had the following selectors: .__web-inspector-hide-shortcut__, .__web-inspector-hide-shortcut__ *, .__web-inspector-hidebefore-shortcut__::before, .__web-inspector-hideafter-shortcut__::after . It turns out it happened because I probably accidently pressed ‘h’ in the keyboard while being in the elements devtools tab. See: http://bricss.net/post/64013104469/quickly-toggling-elements-in-the-web-inspector
4. Our dimple js library fixes will be merged into dimple: https://github.com/PMSI-AlignAlytics/dimple/issues/265#issuecomment-324304802

24-8-2017:

1. We recently upgraded our server side from .net core 1.1 to .net core 2. It wasn’t too hard and I would estimate it at about 5-6 hours of work of one person for a visual studio solution consisting of 30+ projects. The main problem was that some stuff are undocumented which made me to look at the github source code and especially to look at net core 2 changes commits to see exactly what was changed in the code and apply it in our solution. The biggest changes are in the net core identity libraries. Here are some details about the upgrade:
   1. Web listener changed to HttpSys
      1. https://docs.microsoft.com/en-us/aspnet/core/fundamentals/servers/httpsys
      2. Microsoft.AspNetCore.Server.WebListener changed to Microsoft.AspNetCore.Server.HttpSys
      3. WebListenerException changed to HttpSysException (undocumented as far as I saw)
   2. Microsoft.Extensions.PlatformAbstractions has been removed
      1. https://github.com/aspnet/Announcements/issues/237
      2. At first I used the AppDomain alternative (because its a property and not a method so I thought it would be more efficient to use it) but it turns out that compiling for taget framework net core 2 does not support appdomain so better use the other alternative, see: http://michaco.net/blog/EnvironmentVariablesAndConfigurationInASPNETCoreApps
   3. IdentityOptions.SecurityStampValidationInterval -> SecurityStampValidatorOptions.ValidationInterval (undocumented)
   4. CookieAuthenticationOptions separated from IdentityOptions and now the options are inside a factory object in the IOC container (undocumented)
   5. CompactOnMemoryPressure property obsolete: https://github.com/aspnet/Announcements/issues/228
   6. AutomaticAuthentication/Challenge have been replaced by Default[Authenticate/Challenge]Scheme
   7. Helpful resources:
      1. https://weblog.west-wind.com/posts/2017/May/15/Upgrading-to-NET-Core-20-Preview
      2. https://docs.microsoft.com/en-us/aspnet/core/migration/1x-to-2x/
      3. https://docs.microsoft.com/en-us/aspnet/core/migration/1x-to-2x/identity-2x
      4. https://github.com/aspnet/Identity/issues/1364
      5. https://github.com/aspnet/Announcements/issues/257
      6. https://github.com/aspnet/Security/issues/1310
      7. https://docs.microsoft.com/en-us/aspnet/core/security/authentication/cookie?tabs=aspnetcore2x
      8. https://github.com/aspnet/Identity/commit/e6f3ebf5810c793edc6f3b4ca3438194786b86a2
      9. https://github.com/aspnet/Security/pull/1144/files
2. React problematic open source patents license: https://medium.com/@raulk/if-youre-a-startup-you-should-not-use-react-reflecting-on-the-bsd-patents-license-b049d4a67dd2

15-8-2017:

1. jquery 3.2.1 has major memory leak, here is the fix: https://github.com/jquery/jquery/pull/3657/files . Without this fix our website memory usage jumped to 2 giga ram in 20 seconds. This fix is not available yet because 3.2.2 is not out yet so need to manually fix it.
2. Turns out that setting overflow: auto\scroll on mobile will cause bad scrolling experience on iphones. Here is the fix: https://css-tricks.com/snippets/css/momentum-scrolling-on-ios-overflow-elements/
3. My eyes started hurting when developing in a dark theme IDE, so I made a little research and it turns out that its best for the eyes to have the theme similar to the room environment which means that in a bright room the theme should be light and in a dark room the theme should be dark, see: https://ux.stackexchange.com/questions/53264/dark-or-white-color-theme-is-better-for-the-eyes
4. Visual studio android emulator should not be run as administrator so that the sdk will be recognized in path and apk could be installed by drag and drop
5. On ios because of apple policy all browsers such as chrome use the safari webkit engine underneath which is important to know when trying to reproduce css bugs
6. Turns out its really simple to upgrade wordpress version. The official tutorial says to disable all plugins but I didn’t want to do it and the following worked: in the version changes it says which files were changed so I just replaced those files and thats it I restarted the web server and it worked. NOTE: This might not work on bigger versions changes.
7. This blog started being attacked by russian IPs. I am proud.

8-8-2017:

1. Chrome 60 devtools contain a new “Audits” tab which allows to automatically test the website for performance, accessibility, best practices and PWA (built in lighthouse features) https://developers.google.com/web/updates/2017/05/devtools-release-notes
2. Analyzing website performance using chrome: https://developers.google.com/web/tools/chrome-devtools/evaluate-performance/
3. mjml – auto email html generation using markup: https://mjml.io/try-it-live/templates/reactivation-email
4. Animated icons: https://icons8.com/c/animated-icons
5. Library to hide header until you need it: http://wicky.nillia.ms/headroom.js/
6. Workbox – collection of libraries for PWA and it’s the next version of sw-precache https://workboxjs.org/
7. Virtual dom is a concept which can improve the performance of a website. It would be nice if there was some virtual dom hook to jquery\d3 so that we continue to work with d3\jquery as normal but they actually will be working with the virtual dom proxy instead of the real dom and the virtual dom will be responsible to efficiently update the DOM (similar to windows shims). There are many virtual dom libraries (https://bestof.js.org/tags/vdom) but they seem all to require major code rewrites to use them. It would be nice if there would exist this virtual dom hook for jquery\d3. However note that as discussed here (link), updating element directly using javascript has a good performance but requires more work when there are many elements to update, than just using a virtual dom.
8. javascript library allowing to scan the javascript source code and find code which is using old libraries which have known vulnerabilities: https://github.com/RetireJS/retire.js
9. Library which cleans dengerous html from given svg\html: https://github.com/cure53/DOMPurify , can be used it for svg’s and cases where you need real html but want it to be safe. it started as a poc of an academic research so its not just something someone crafted at home https://www.usenix.org/conference/enigma2016/conference-program/presentation/heiderich
10. In cases where you just want to protect from xss there is nice yahoo library where you tell it where the input goes to and it applies appropriate protection: https://github.com/yahoo/xss-filters
11. If want full control over the sanitization there is this library: https://github.com/punkave/sanitize-html
12. Library allowing to check if string is using characters of some language and perform other validations: https://github.com/chriso/validator.js
13. Functional js validation library: https://github.com/hapijs/joi
14. Manually validating string language in javascript: https://stackoverflow.com/questions/13855335/validate-field-for-all-language-characters-through-regex/13855453#13855453
15. Parsley – an alternative to jquery validation but it seems there are mixed opinions about their comparison which doesn’t give a good enough of a reason to switch to parsley from jquery validation https://github.com/guillaumepotier/Parsley.js/

5-8-2017:

1. This week I installed a self hosted mail server and on the way I encountered numerous problems and fixed them, here is the info I documented from the process:
   1. Choosing mail server
      1. I started from installing windows IIS built in SMTP server and it worked for outgoing email but it does not support pop3 and is not advised to be used as the main mail server so I started searching for an alternative.
      2. Since we are in the Microsoft bizspark program and have a license for Microsoft Exchange, I thought to install it but it turns out that it required active directory. Even though I could install a single server active directory, it is a little overkill in my opinion at this stage so I decided not to use it.
      3. hmailserver – https://github.com/hmailserver/hmailserver/ – popular, open source and active and seems as one of the most suggested servers so chose it.
   2. Choosing webmail service:
      1. For convenient access to the mail server for the users I wanted to install a webmail service.
      2. It seems the three main open source alternatives are: roundcube, squirrelmail and horde.
      3. squirrelmail is inferrior with its UI and features.
      4. horde has more features than roundcube but worse UI.
      5. Roundcube has enough features and its UI\UX is more usable so I chose it.
   3. Installing windows built in SMTP server:
      1. Good tutorial: http://www.vsysad.com/2017/05/install-and-configure-smtp-server-on-windows-server-2016/
      2. Create dns MX records
      3. Create certificate with subject name including smtp.domain.com
      4. Powershell test that server is working (if enabled ssl then need disable server certificate check for test to work for localhost, the first command here does exactly that): [System.Net.ServicePointManager]::ServerCertificateValidationCallback = { return $true };Send-MailMessage -SMTPServer localhost -To mail@gmail.com -From user@domain.com -Subject “server is up” -Body “server is up” -UseSsl
      5. Understanding built in SMTP server directory structure: http://www.vsysad.com/2014/01/iis-smtp-folders-and-domains-explained/
      6. For local php to work disable https and in php.ini add sendmail_from system@domain.com
      7. Change php.ini date.timezone to UTC
      8. In properties of smtp server in inetmgr6 set outgoing connections to use tls
   4. Installing hmailserver steps:
      1. https://www.hmailserver.com/download/
      2. https://www.hmailserver.com/forum/viewtopic.php?p=85944
      3. https://www.hmailserver.com/documentation/latest/?page=howto_install – open firewall rules in windows+azure
      4. run diagnostic to check that all works
      5. https://www.hmailserver.com/documentation/latest/?page=basic_configuration
      6. antivirus using defender:
         1. “C:\Program Files\Windows Defender\mpcmdrun.exe” -scan -scantype 3 -file “%FILE%” -disableremediation
         2. with return 2
      7. https://www.hmailserver.com/documentation/v5.3/?page=reference_sslcertificates
      8. https://www.hmailserver.com/documentation/latest/?page=howto_install_phpwebadmin
      9. in php.ini change display_errors to On to see errors for easier troubleshoot and turn off afterwards
      10. add hMailServer dcom object permissions to local active for IIS_IUSRS https://stackoverflow.com/questions/27291049/phpwebadmin-not-working-dcom-error-despite-modifying-permissions/33062173#33062173
      11. when using basic authentication the iis impersonates by default the user which is logged in and he should be given permissions on the directory (if iis site basic settings connect as pass-through is enabled), permissions to C:\Windows\Temp\PHP56_errors.log and C:\Windows\Temp\php-mail-errors.log and other directories
      12. configure all protocols protocols to use STARTTLS (Optional) because using SSL\TLS will fail for stuff like php mail
      13. sending mail to alias of yourself does not work if the alias is connected to gmail
      14. Using alias: http://www.maximumasp.com/support/kb/article.aspx?article=504
      15. cookies problem might cause a bug in web admin which redirects back to login after successful login, to verify that try login in anonymous tab, also permissions problem can cause it so look for access_denied in procmon on server on login (permissions problem in php sessions directory)
      16. for debug write to log in php using: error_log(“Error message\n”, 3, “C:\inetpub\phptmpdir\php.log”);
   5. Installing roundcube steps:
      1. http://www.iis-aid.com/articles/how_to_guides/install_and_configure_roundcube_webmail_on_iis
      2. https://github.com/roundcube/roundcubemail/wiki/Installation
      3. user 127.0.0.1 instead of localhost on user creation to prevent dns resolution for better performance
      4. https://stackoverflow.com/questions/23851821/setting-file-permissions-in-windows-with-php
      5. change temp directory in php.ini using upload_tmp_dir = “C:\inetpub\phptmp\” and session.save_path = “C:\inetpub\phpsession\” and give read write execute permissions to IUSR and IIS_IUSRS. change under [WebPIChanges] also! (2 places in php.ini)
      6. $config[‘mime_types’] = ‘C:\inetpub\roundcube\wwwroot\config\mime.types.txt’; http://www.roundcubeforum.net/index.php?topic=16899.0
      7. https://wiki.archlinux.org/index.php/Roundcube
      8. https://www.hmailserver.com/forum/viewtopic.php?t=21540
      9. use redundant_attachments plugin instead of filesystem_attachments
      10. attempt to install pspell (too old and unsupported, see: https://bugs.php.net/bug.php?id=47464 and need compile it into php so chose enchant over pspell)
          1. https://support.plesk.com/hc/en-us/articles/213902545-How-to-enable-Aspell-spell-cheking-in-Roundcube-
          2. http://code.stephenmorley.org/php/enabling-pspell-in-xampp-on-windows/
          3. http://www.bitweaver.org/wiki/Install+pspell+on+Windows
          4. https://stackoverflow.com/questions/5799843/find-if-the-installed-php-is-threadsafe-or-nonthreadsafe
          5. find php_pspell.dll in php 5.2.9 download from http://php.net/releases/
      11. install enchant
          1. install https://www.abisource.com/download/
          2. http://php.net/manual/en/enchant.examples.php change soong to sooong because soong is not incorrect
          3. add extension=php_enchant.dll in php.ini
          4. (optional)copy files from C:\Program Files (x86)\AbiWord\dictionary\ispell to C:\Program Files (x86)\PHP\v5.6\share\enchant\ispell
          5. can download xpi from here turn it to zip and get aff and dic files from there and change – to _ and put them in C:\Program Files (x86)\PHP\v5.6\share\enchant\myspell https://addons.mozilla.org/en-US/firefox/language-tools/ (can copy download link from firefox and download with chrome)
          6. better have copies of the language files with default en.dic,en.aff too in case code uses en\ru\he like roundcube does so that it will find the dictionary
          7. Roundcube plugins installation (many plugins are unsupported or do not work in new roundcube version so here are the working ones):
             1. install composer – the php package manager – https://getcomposer.org/doc/00-intro.md
             2. install git for windows https://git-scm.com/download/win used by composer to download packages
             3. make plugins directory writable by iis application pool users (aka IIS APPPOOL\appname)
             4. enigma plugin doesn’t work on windows http://www.roundcubeforum.net/index.php?topic=24337.0
             5. plugin installation instructions using composer https://plugins.roundcube.net/
             6. after git and composer are installed then just run commands like “composer require melanie2/jquery_mobile” from the wwwroot directory to install more plugins
             7. plugins\skins list:
                1. https://plugins.roundcube.net/packages/roundcube/plugin-installer
                2. mobile – checked it and it doesnt work with new roundcube 1.3 which uses jquery3 incompatible yet with jquery mobile used by the mobile skin:
                   1. https://roundcubeinbox.wordpress.com/2016/04/26/roundcube-for-mobile-devices/
                   2. https://plugins.roundcube.net/packages/melanie2/jquery_mobile
                   3. https://github.com/messagerie-melanie2/Roundcube-Skin-Melanie2-Larry-Mobile
                   4. https://github.com/messagerie-melanie2/Roundcube-Plugin-Mobile
                   5. bug related to roundcube jquery: https://github.com/messagerie-melanie2/Roundcube-Plugin-Mobile/issues/26
                   6. jquery mobile 1.5 is compatible with jquery 3: https://github.com/jquery/jquery-mobile/issues/8546#issuecomment-271163317
                3. soon responsive mobile skin will be available: https://github.com/roundcube/elastic
                4. https://plugins.roundcube.net/packages/johndoh/contextmenu
                5. https://plugins.roundcube.net/packages/sblaisot/automatic_addressbook
                6. https://plugins.roundcube.net/packages/kolab/calendar
                7. https://plugins.roundcube.net/packages/kolab/tasklist
                8. https://plugins.roundcube.net/packages/roundcube/chbox
                9. https://plugins.roundcube.net/packages/cor/keyboard_shortcuts
                10. https://plugins.roundcube.net/packages/mat_krauser/image_paster
                11. https://github.com/EstudioNexos/mabola
2. ios email gotchas: https://litmus.com/blog/9-things-you-need-to-know-about-email-in-ios-10
3. Javascript animations library Velocity had no changes in its main github (https://github.com/julianshapiro/velocity) and website for a lot of time so we thought to change our code to use an alternative. Since GSAP has a problematic license it seemed that popmotion is a good alternative. What we found out then was that:
   1. Using popmotion is much less trivial than using Velocity and the code is less readable.
   2. Turns out Velocity library main github was not updated because the main work was done on the development branch on the v2 version https://github.com/julianshapiro/velocity/tree/develop.
   3. So our conclusion was to stay with Velocity.
4. We upgraded our charts javascript code from d3 to d3 v4, it required to change some breaking change syntaxes and to fix several bugs in the dimple library we use (this helped):
   1. –
      1. Change
         1. d3.select(“body”)[0][0]
      2. To
         1. d3.select(“body”).node()
   2. –
      1. Change
         1. d3.time.format.iso.parse
      2. To
         1. d3.isoParse
   3. –
      1. Change
         1. d3.time.format.utc(“%Y-%m-%dT%H:%M:%SZ”).parse(time)
      2. To
         1. d3.utcFormat(“%Y-%m-%dT%H:%M:%SZ”)(time)
   4. –
      1. Change
         1. d3.time.format(“%Y-%m-%d”).parse
      2. To
         1. d3.timeParse(“%Y-%m-%d”)
   5. –
      1. Change
         1. d3.time.format(“%Y-%m-%d”)(time)
      2. To
         1. d3.timeFormat(“%Y-%m-%d”)(time)
   6. –
      1. Change
         1. d3.time.format.utc(“%Y-%m-%dT%H:%M:%SZ”).parse(time)
      2. To
         1. d3.utcFormat(“%Y-%m-%dT%H:%M:%SZ”)(time)
   7. –
      1. Change
         1. .call(function () { this.style(….); });
      2. To
         1. .call(function (context) {context.style(….);});
   8. –
      1. Change
         1. .ease(“linear”)
      2. To
         1. .ease(d3.easeLinear)
   9. –
      1. Change
         1. chart.svg[0]
      2. To
         1. chart.svg.node()
   10. Fixed dimple bugs https://github.com/PMSI-AlignAlytics/dimple/issues/265#issuecomment-320388279:
       1. –
          1. Change
             1. series._markers[lineDataRow.keyString] = markers;
          2. To
             1. series._markers[lineDataRow.keyString] = markers.merge(shapes);
       2. –
          1. Change
             1. series._markerBacks[lineDataRow.keyString] = markerBacks;
          2. To
             1. series._markerBacks[lineDataRow.keyString] = markerBacks.merge(shapes);
       3. –
          1. Change
             1. series.shapes = series._group.selectAll(“.” + className);
          2. To
             1. series.shapes = theseShapes.merge(entered);
   11. Note that the change in d3 selectors behavior can cause bugs of duplicate elements in DOM.

30-7-2017:

1. Some insights from bugs we encountered recently:
   1. Using autofocus html input tag attribute in mobile site can cause bugs related to pages transitions using framework7 and others.
   2. Need set css style cursor: pointer to the body of mobile site for click event to be triggered correctly on safari mobile, see: https://developer.mozilla.org/en-US/docs/Web/Events/click#Safari_Mobile , this can solve bug of bootstrap popover not closing in mobile safari.
   3. The nodoubletapzoom function suggested here: https://stackoverflow.com/questions/15804296/how-to-prevent-doubletap-zoom-in-ios-and-android is causing bad scrolling expirience on iphone.
   4. We encountered a situation where an element had position: absolute without top\bottom\left\right being defined and it worked well everywhere except on iphone PWA (progressive web app), so anyway the best practice is not to leave position: absolute without top\botoom\left\right being defined.
   5. Browserstack site CapsLock does not work sometimes and it can cause wrong you to enter wrong password which can lock out a user without you knowing why.
   6. transform: translateZ(0); does not work on ios safari and -webkit-transform: translateZ(0) should be used also to make it work there.
   7. In visual studio 2017 solution with many projects the NuGet restore is throwing errors when the solution is first loaded, this was fixed in latest Nuget and the update is still not integrated in visual studio (in latest visual studio the Nuget is integrated inside visual studio and it isn’t an extension), but probably it will soon be updated in visual studio: https://github.com/NuGet/NuGet.Client/pull/1198
   8. We had a position:fixed menu with elements inside it and its background was hiding its children’s background on ios devices while working well on windows devices.
   9. When using basic authentication in the web server then PWA reauthenticates every time its opened and also the iphone Save To Home doesn’t authenticate for the favicon causing the PWA icon to not work. To solve it you can open https://username:password@www.site.com/homepage where the username and password are the basic authentication username and password. Be careful with this link because it contains cleartext password.
   10. Google recaptcha project seems to be dead from several reasons, I opened an issue asking about this in their github: https://github.com/google/recaptcha/issues/171
   11. If checkbox in mobile have id duplicated with other item then the checkbox might not work (hard to debug this so good to know).
   12. Mediaelement popular video javascript library until recently had a license problem because they used GPL inside their code even though they were licensed as MIT library. This was happening for a lot of time and probably made a lot of companies uncompliant to the GPL license because they thought they had no GPL while they actually DID have GPL even though mediaelement wrote that it is MIT licensed, see: https://github.com/mediaelement/mediaelement/issues/1187
   13. Chrome has yellow autocomplete background for ::autofill style, this fixes it on desktop but doesn’t work on mobile when going out and back in the screen with the input: https://stackoverflow.com/questions/2781549/removing-input-background-colour-for-chrome-autocomplete/29350537#29350537 this DOES work but when turned on then turns off framework7 animation of going back in the page with the autofilled input (I saw same effect done by the html autofocus so I goes the autofill animation triggers something like redraw which causes the page to appear too early): https://stackoverflow.com/questions/2781549/removing-input-background-colour-for-chrome-autocomplete/37432260#37432260 
2. Css native display: grid seems to be the future of web layouts. Non display and non grid displays should be used for simple purposes, flexbox should be used to position specific elements on the page with full control, grid should be used for the whole page layout.
   1. https://stackoverflow.com/questions/21516558/what-are-the-main-advantages-of-using-flex-style-in-css
   2. https://css-tricks.com/snippets/css/complete-guide-grid/
   3. https://developers.google.com/web/updates/2017/01/css-grid
   4. https://gridbyexample.com/
   5. Native css grid will have probably better performance because it’s native so don’t waste too much time on grid framework selection because it will change in future.
3. Css flexbox:
   1. Flexbox give control easier then using more code without it to achieve the same thing and flexbox is built for it so might be better performing.
   2. Old flexbox had bad performance but new one has a good performance https://css-tricks.com/using-flexbox/
   3. https://developers.google.com/web/updates/2013/10/Flexbox-layout-isn-t-slow
   4. According to this benchmark nested flexbox is not that bad as well performance wise: https://stackoverflow.com/questions/39463220/does-deep-nesting-flexbox-layout-cause-performance-issue
4. Reading css style causes browser recalculate page layout so reading and writing and then reading again causes two calculations. Need to do batch reading and then batch writing for better performance or use this: https://github.com/wilsonpage/fastdom More performance tips: https://developers.google.com/web/fundamentals/performance/rendering/avoid-large-complex-layouts-and-layout-thrashing
5. Bulma is a 17000+ github stars css library based on flexbox so I researched it to check if we should use it and here is the conclusion:
   1. Bulma uses sass instead of scss and it requires a little handling to mix them and also we don’t want to introduce new language/syntax to our project unless there is a good enough reason for it and since the only nice thing about bulma is it’s automatic grid, similar can be achieved in framework7 col-auto and it also can be problematic because of its unpredictability when later modifying html structure. So seems there is no good reason overall to use bulma right now (in addition the future of layout is css native grid so that is another reason not to put too much time right now on grid frameworks changes) https://github.com/jgthms/bulma/issues/184
   2. However need to remember bulma in case we will need some functionality with flexbox not provided by framework7 then we should check if it exists in bulma and advantage of bulma is that we can import only part of it independently from its other parts
   3. Here is an admin panel built with bulma and vue (I see its popular to combine vue with bulma): https://admin.vuebulma.com/#/dashboard
6. Modernizer is very popular – should we use it? Conclusion – don’t pre-optimize and add it only if there will be a need by the users/qa results.
7. Purecss is a yahoo 17000+ github stars css library, should we use it? Conclusion – Purecss can be used by a page not requiring a lot of stuff, instead of bootstrap to decrease size. This is insignificant and irrelevant for us at this stage.
8. PWA apis:
   1. Push notifications – https://developers.google.com/web/fundamentals/getting-started/codelabs/push-notifications/
   2. Permissions – https://developers.google.com/web/updates/2015/04/permissions-api-for-the-web
   3. For every API lists supported browsers: https://developer.microsoft.com/en-us/microsoft-edge/platform/status/
9. Where to create account for app store\playstore\microsoft store:
   1. https://developer.apple.com/programs/enroll/
   2. https://play.google.com/apps/publish/signup/
   3. https://developer.microsoft.com/en-us/store/register
10. In IOS 11 apple upgraded PWA (they call it home screen apps) to be hosted in WKWebView instead of UIWebView which fixes the click delay bug and many others https://developer.apple.com/library/content/releasenotes/General/WhatsNewInSafari/Safari_11_0/Safari_11_0.html
11. Turns out Steve Jobs talked about PWA experience back in 2007 and apple supports PWA alternative since then such as: https://developer.apple.com/library/content/documentation/iPhone/Conceptual/SafariJSDatabaseGuide/OfflineApplicationCache/OfflineApplicationCache.html so its not that you cant make a PWA in iphones, you just need to do it the Apple way.
12. Referrer spam list: https://github.com/piwik/referrer-spam-blacklist
13. Operating system and more info by user agent: http://browscap.org/
14. After mac added support to push notifications, chrome integrated it in their push api: https://developers.google.com/web/updates/2017/04/native-mac-os-notifications

24-7-2017:

1. Automatic resume generation by your github user: https://resume.github.io/
2. Some very popular libraries to know if will encounter their use case (went over all github js libraries which have over 10000 stars):
   1. Chart js – 31000+ stars on github – https://github.com/chartjs/Chart.js
      1. Manipulates charts over canvas.
      2. Good starter library if we will move to working with canvas from working with svg.
      3. Canvas charts have better performance than svg charts however they are less convenient to work with and don’t support css files.
   2. three js – 34000+ stars on github – https://github.com/mrdoob/three.js/
      1. Allows creating 3d elements with javascript.
      2. Extends what you would think is possible with javascript: https://threejs.org/examples/
   3. 21000+ stars crossbrowser extension to write emails and html as markdown and convert it to html https://github.com/adam-p/markdown-here
   4. Pixi – 15000+ stars 2d rendering engine – https://github.com/pixijs/pixi.js
   5. materialize – 27000+ stars alternative to bootstrap – https://github.com/Dogfalo/materialize
      1. No clear advantage over bootstrap.
      2. Uses material design.
   6. Leaflet – 18000+ stars library for interactive maps – https://github.com/Leaflet/Leaflet
   7. Video js – 16000+ stars library alternative for mediaelement library for videos – https://github.com/videojs/video.js
   8. bootstrap datepicker with 9000+ stars – https://github.com/uxsolutions/bootstrap-datepicker
      1. A more active and popular alternative to: https://github.com/smalot/bootstrap-datetimepicker
   9. Best active\popular site tour libraries:
      1. Free:
         1. https://github.com/HubSpot/shepherd
         2. https://github.com/linkedin/hopscotch – by linkedin
      2. Commercial:
         1. https://github.com/usablica/intro.js
   10. Crossbrowser clipboard copying library with 18000+ stars – https://github.com/zenorocha/clipboard.js
   11. Amazing 19000+ stars charting library by baidu https://github.com/ecomfe/echarts
   12. Pace – 12000+ stars progress bar library – https://github.com/HubSpot/pace which kind of replace the following 14000+ stars library: https://github.com/rstacruz/nprogress
   13. Quill – 14000+ stars rich text editor – https://github.com/quilljs/quill comparison with other text editors: https://quilljs.com/guides/comparison-with-other-rich-text-editors/
   14. Mermaid – 13000+ stars library turning text into charts – https://github.com/knsv/mermaid
   15. Free bootstrap 3 admin template – 11000+ stars – https://github.com/puikinsh/gentelella
   16. Automatically creates a desktop program from a website – 11000+ stars – https://github.com/jiahaog/nativefier
   17.  Sortable 10000+ stars alternative to jquery sortable for items sorting by dragging – https://github.com/RubaXa/Sortable

22-7-2017:

1. PGO (profile guided optimizations) is a compilation optimization which improves performance. .net core 1.1 started using it and .net core 2 will extend its use to gain even more performance improvement at more platforms
   1. http://www.infoworld.com/article/3209763/application-development/net-core-20-to-extend-coding-optimizations-to-linux.html
   2. https://blogs.msdn.microsoft.com/dotnet/2017/07/20/profile-guided-optimization-in-net-core-2-0/
   3. https://blogs.msdn.microsoft.com/dotnet/2016/11/16/announcing-net-core-1-1/
2. Integrating globalization and localization in .net core: http://www.c-sharpcorner.com/article/internationalization-in-asp-net-core-mvc/
3. Google developing keyboard for iphone + in 2014 google paid 1 billion dollars to be the default search in iphone https://kreationnext.com/support/google-developing-keyboard-for-iphone-in-hopes-of-boosting-search-volumes-report/
4. Dom7 is much slower than jquery in some queries such as parents query: https://jsperf.com/parents-method-dom7-vs-jquery
5. Useful tools\libraries:
   1. .net syntax Linq implementation in javascript: https://github.com/mihaifm/linq
   2. Fast lightweight animation library with good performance: https://github.com/popmotion/popmotion
   3. Faster alternative to npm and yarn which saved modules only once on disk for all pc systems https://github.com/pnpm/pnpm
   4. Library to use to style browser console. Can be used when showing self xss warning like in facebook https://github.com/pd4d10/tiza
   5. Companies and products svg icons MIT licensed: http://konpa.github.io/devicon/
   6. Performs smooth interpolated transition between different shapes: https://github.com/veltman/flubber
   7. We use d3 so we will need to upgrade to d3 v4: https://github.com/d3/d3/blob/master/CHANGES.md
   8. Dimple library performance improvements: https://github.com/PMSI-AlignAlytics/dimple/compare/master…upsight:performance-fix?expand=1 https://github.com/PMSI-AlignAlytics/dimple/issues/178
   9. Billboard js seems like a good new charting js library alternative: https://github.com/naver/billboard.js/wiki/Why-we-decided-to-start-billboard.js%3F good points about billboard needing to prove itself: https://www.reddit.com/r/javascript/comments/6g8k8h/billboardjs_a_reusable_easy_interface_javascript/
   10. I found a js chart libraries comparison in wiki: https://en.wikipedia.org/wiki/Comparison_of_JavaScript_charting_frameworks
   11. Interesting discussing related to performance improvement and webpack: https://github.com/naver/billboard.js/issues/23
   12. Library for easy crossplatform html email development: http://slicejack.github.io/bojler/getting-started they suggest testing the email at http://litmus.com/or https://www.emailonacid.com/
   13. js library for AB testing: https://github.com/dollarshaveclub/study
   14. Free bootstrap 4 ui elements library: https://github.com/creativetimofficial/now-ui-kit
6. Lodash:
   1. Lodash vs underscore comparison with conclusions that lodash is the winner because it has better performance and more functionality https://stackoverflow.com/questions/13789618/differences-between-lodash-and-underscore lodash was created out of underscore and took over and then there were discussions to merge back but finally they decided that lodash v4 was a kind of merge so underscore became kind of deprecated in favor of lodash, see: https://github.com/jashkenas/underscore/issues/2182 https://github.com/underdash/underdash/issues/14
   2. Seems that Ramda is becoming very popular as functional alternative for lodash (but lodash v4 has functional logic too). Also rambda is like a lightweight version of ramda with better performance and small size, see: http://vvgomes.com/ramda-vs-lodash/ http://funkyjavascript.com/i-think-ramda-might-be-better-than-lodash-or-underscore/ https://survivejs.com/blog/rambda-interview/
   3. There is a great point that now that javascript new versions have many of the features of lodash, that using lodash might be unnecessary anymore however lodash will still have more utils if needed: https://derickbailey.com/2016/09/12/does-es6-mean-the-end-of-underscore-lodash/
   4. The approach in our company so far is to use jquery and also to just find the best implementation of specific functions we need and that’s it and not bringing utils library like lodash, however I now research lodash to understand if we should integrate it in our systems. Lodash vs jquery vs native foreach performance of array loops shows that jquery is slower than native but lodash is faster than native, see: https://jsperf.com/jquery-vs-lowdash-loops/24 this performance test shows that jquery and lodash perform almost the same where native for loop is incredibly faster: https://jsperf.com/jquery-vs-lodash/
   5. Seems that a reason to use lodash over native filter, bind, map is that it is faster and more cross browser so it might be a better solution then using a shimming library for those functions: https://www.reddit.com/r/javascript/comments/41fq2s/why_should_i_use_lodash_or_rather_what_lodash/
   6. However when old browsers support is not required then I liked the following comment saying that using lodash is premature optimization: https://www.reddit.com/r/javascript/comments/41fq2s/why_should_i_use_lodash_or_rather_what_lodash/cz2oc5g/
   7. Lodash functions which we could use in our code even though jquery is used:
      1. https://lodash.com/docs/4.17.4#debounce – executes function when passed at-least xxx time from its last invocation (each invocation happening before the delay passed is delaying the execution even further). important to use on resize and similar events for better performance – when we want the execution to happen at last invocation (or first – a flag of debounce) – useful for window resize where it doesn’t matter what happens until the resize finishes and only need to handle the last event invocation https://css-tricks.com/debouncing-throttling-explained-examples/
      2. https://lodash.com/docs/4.17.4#once – important to use for initializations code
      3. https://lodash.com/docs/4.17.4#throttle – executes function at most once every xxx period of time. Prevents multiple simultanious executions but ensures execution at-least once every period of time if the function was invoked. useful to invoke a function at most once every period of time (the difference between this and setInterval is that throttle might not invoke the function at all) – useful for scrolling where need to update screen every period of time so can’t wait until scrolling finished so debounce is bad and throttle is good in that case. Twitter had a bug in scrolling because they didn’t use throttle: https://johnresig.com/blog/learning-from-twitter/
      4. https://lodash.com/docs/4.17.4#memoize – important for code block which is being run multiple times returning same output when receiving the same input
      5. https://lodash.com/docs/4.17.4#partial – useful  in case when need to create an inline function which invokes some other function with parameters (for example for setTimeout)
      6. https://lodash.com/docs/4.17.4#delay – useful to execute some function which parameters after a delay, shorter syntax and less place for bugs than creating inline functions or using lodash partial
      7. https://lodash.com/docs/4.17.4#isUndefined – correctly checking for undefined value instead of implementing this function ourselves
      8. https://lodash.com/docs/4.17.4#find – find objects by multiple properties values
      9. https://lodash.com/docs/4.17.4#keyBy – creating index
      10. https://lodash.com/docs/4.17.4#invert – invert a dictionary
      11. https://lodash.com/docs/4.17.4#forEach (jquery foreach is slower)
      12. https://lodash.com/docs/4.17.4#times – iterating a constant number of times
      13. https://lodash.com/docs/4.17.4#map (supports the following which is not supported by native map: _.map([arr1,arr2], ‘arr1[0].name’)
      14. orderby and sort functions for complex sorts of small amount of items (simple sort can be done easily with native javascript and also if there are many items then should use native sort for better performance, but in other cases its much easier to use lodash orderby and sort functions https://jsperf.com/native-sort-vs-lodash-sortby https://jsperf.com/underscore-vs-native-vs-lodash-sort
      15. https://lodash.com/docs/4.17.4#shuffle – useful for random shuffle, implemented using: https://en.wikipedia.org/wiki/Fisher%E2%80%93Yates_shuffle
      16. https://lodash.com/docs/4.17.4#some – checks if there is any element which satisfies the desired condition of properties
      17. https://lodash.com/docs/4.17.4#template – use templates when dealing with building html inside javascript
      18. https://lodash.com/docs/4.17.4#flow – use to chain functions
   8. Jquery function which should be used instead of lodash functions:
      1. Use jquery extend to clone object instead of using lodash extend or cloneDeep which are slower: https://jsperf.com/deep-clone-lodash-vs-jquery
7. Easily view jquery source code: https://j11y.io/jquery/#v=git&fn=jQuery.fn.val
8. An amazing site showing native alternative to jquery methods and also library alternatives for each method: http://youmightnotneedjquery.com/
9. Turns out that javascript innerText is non standard and instead should use textContent but take into account the differences discussed here: https://stackoverflow.com/questions/35213147/difference-between-text-content-vs-inner-text
10. Registering debounce of lodash or other implementation on resize event or similar is important for performance: https://lodash.com/docs/4.17.4#debounce
11. Build only necessary jquery components to decrease size: http://projects.jga.me/jquery-builder/

20-7-2017:

1. I recently encountered a case where the text inside html button element was positioned vertically in the center and when I changed the element to be an <a> element then the text stopped being vertically aligned to the center. I thought at first that it is related to some css so when over all the rules but came to the conclusion there is no rule effecting this and then after some googling I found out that the text inside html button elements is vertically aligned to center by default while this is not the case for html <a> element. This is good to know to save some time in the future.
2. Apple deprecated OpenSSL for macOS and thus .net core 2 moved to use apple security framework on macOS: https://github.com/dotnet/announcements/issues/21
3. .net core 2 will support the new apple OS: High Sierra: https://github.com/dotnet/announcements/issues/22
4. Microsoft wants to provide internet over white-space https://hothardware.com/news/microsoft-announce-10b-initiative-broadband-internet-rural-america
5. Google payment requests API will help eleminate the need for checkout forms: https://developers.google.com/web/fundamentals/discovery-and-monetization/payment-request/
6. Asp.net mvc localization mechanism vulnerability causing the IIS application pool to crash https://www.sidertia.com/Home/Community/Blog/2017/07/14/Microsoft-fixes-the-CVE-2017-8585-security-vulnerability-discovered-by-Sidertia-Team

15-7-2017:

1. Microsoft have new project templates for SPA using react, angular, react+redux for .net core 2: http://gunnarpeipman.com/2017/07/aspnet-core2-spa/ we are wai
2. We are waiting at Fokoya for the final release of .net core 2 to upgrade to it, its supposed to be very soon according to the roadmap: https://github.com/aspnet/Home/wiki/Roadmap , there will be numerous new abilities in .net core 2 including improvement of kestrel which brings it closer to being able to be a server of its own without using IIS as reverse proxy https://www.infoq.com/news/2017/07/aspnetcore2-preview2
3. Interesting to follow this issue about .net core security updates integration into windows update: https://github.com/dotnet/core/issues/742
4. As your probably heard PWA (progressive web apps) is the future probably. Google created chrome plugin which can test your site and generate a report about what should you improve: https://chrome.google.com/webstore/detail/lighthouse/blipmdconlkpinefehnmjammfjpmpbjk?hl=en
5. Easily generating PWA with webpack https://codeburst.io/progressive-web-app-with-webpack-198b073f6c74
6. Since microsoft acquired xamarin and open sourced it, xamarin became one of the leading choices for cross platform app development. Xamarin has a couple of components where the xamarin webview component is the cross platform one.  It is very fast on android, however on ios it is better to use alternative renderer. I have read that all ios browsers are basically using the apple browser control because apple does not allow any other way so there is not much difference or performance gain in ios xamarin webview over cordova. https://developer.xamarin.com/guides/xamarin-forms/user-interface/webview/

Intro:

As new libraries and ideas arise in the tech world every day, its important to stay updated so that the next time our company will have a requirement or a problem then maybe we will be able to use those ideas and libraries to bring a solution.

We use mainly postgresql, .net core, jquery, sass, d3, framework7 and webpack. So this is an ongoing post which will be updated with tech news mainly related to those technologies. It will also include general interesting information, not necessarily new one, and insights from some bugs we encounter in our development.

How do we find new information?

1. Search in google using google search tools to limit search results to the last day or week. Search keywords related to the technologies such as
   1. net core
   2. net core github
   3. github microsoft announcement
   4. github aspnet announcement
   5. github dotnet announcement
   6. progressive web app
2. Search github for keywords such as “net core”.
3. Go over “dotnet”, “aspnet”, “microsoft” repositories in github.
4. Search stackoverflow by tags according to our keywords such as “net core”.
5. Look at the site in the following link which gives new lists of css and js libraries every month, for example: https://tutorialzine.com/2017/07/15-interesting-javascript-and-css-libraries-for-july-2017
6. Look at js news here: http://www.echojs.com/ and here: http://jsfeeds.com/
7. Look for popular libraries here: https://www.javascripting.com/
8. Javascript libraries which got the most new stars on github: https://github.com/trending/javascript
9. Top used libraries from the stats here: https://libscore.com/
10. Top js libraries by popularity\tags\trending: https://bestof.js.org/
11. Web github repositories with the most stars (I summarized them at the 27-7-2017 update): https://gist.github.com/jhnns/94188ba0904a82bbd0491bb21b041ce8 scripts to retrieve info from github, stackoverflow, etc: https://github.com/jhnns/popular-javascript-projects
12. Net core stuff: https://github.com/thangchung/awesome-dotnet-core
13. Dotnet news: http://dotnetmashup.azurewebsites.net

Pending researches:

1. Why use redux?
2. Go over: https://github.com/Kickball/awesome-selfhosted
3. Search alternatives to: https://github.com/defunkt/jquery-pjax for turning jquery into load behaviour automatically – understand if any difference from framework7
4. Why use window.fetch and consider https://github.com/github/fetch
5. Web app install banners on ios such as https://github.com/austinpray/angular-add-to-home-screen
6. Preventing ios pwa from reloading on open – maybe by caching url+scroll states in local storage and loading them on start
7. Pwa auto-open from browser after link click or other event https://stackoverflow.com/questions/38713685/how-can-i-initiate-a-pwa-progressive-webapp-open-from-a-click-on-a-push-notifi