teleren/devto huggingface dataset:
Code Smell 20 - Premature Optimization
Tags: oop, developing, coding, codesmell
Published: 2020-11-08 14:15:24

*Planning ahead of time needs a crystal ball no developer has.*

> TL;DR: Don't guess things that might not happen.

# Problems

- Coupling

- Testability

- Readability

- [YAGNI](https://en.wikipedia.org/wiki/You_aren%27t_gonna_need_it)

# Solutions

1. Create great [models](https://dev.to/mcsee/what-is-wrong-with-software-5pa) and [bijections](https://dev.to/mcsee/the-one-and-only-software-design-principle-3086) first.

2. Create a conclusive benchmark once the model is working.

3. *Programmers waste enormous amounts of time worrying about, the speed of noncritical parts of their programs, and these attempts at efficiency actually have a strong negative impact when debugging and maintenance are considered.* Donald Knuth

4. [Design for Performance](https://wiki.c2.com/?DesignForPerformance).

5. Use Test Driven Development technique. It always favors the simplest solution.

# Examples

- Weird data structures

- Caches

- Singletons

# Sample Code

## Wrong

[Gist Url]: # (https://gist.github.com/mcsee/9ac202ec7527f486b6a3ff1895d6ba41)
```javascript
class Person {
    ancestors() {
        cachedResults = GlobalPeopleSingletonCache.getInstance().relativesCache(this.id);
        if (cachedResults != null) {
            return (cachedResults.hashFor(this.id)).getAllParents();
        }
        return database().getAllParents(this.id);
    }
}
```

## Right

[Gist Url]: # (https://gist.github.com/mcsee/8f6b87de8228b342caabefab2b05ca42)
```javascript
class Person {   
  ancestors(){
     return this.mother.meAndAncerstors().concat(this.father.meAndAncerstors());      
  }
  meAndAncerstors(){
     return this.ancestors().push(this);
  }
}
```

# Detection

This is a design smell so it can not be detected by mechanical tools (yet).

# Tags

- Premature Optimization

- Antipattern

# Conclusion

Defer performance decisions until functional models are mature enough.

Donald Knuth created/compiled the best/fastest algorithms and data structures. With great wisdom he warned us of abuse. Why do we think we are smarter than him? 

# Relations

{% post https://dev.to/mcsee/code-smell-06-too-clever-programmer-37lb %}

# More info

- [c2 wiki](https://wiki.c2.com/?PrematureOptimization)

- [Wikipedia](https://en.wikipedia.org/wiki/Program_optimization)

{% post https://dev.to/mcsee/singleton-the-root-of-all-evil-50bh %}

# Credits

Photo by <a href="https://unsplash.com/@markusspiske">Markus Spiske</a> on <a href="https://unsplash.com/s/photos/code">Unsplash</a>

* * *

> Premature optimization is the root of all evil.

_Donald Knuth_

{% post https://dev.to/mcsee/software-engineering-great-quotes-26ci %}

* * *

This article is part of the CodeSmell Series.

{% post https://dev.to/mcsee/how-to-find-the-stinky-parts-of-your-code-1dbc %}

*Last update: 2021/07/02*
Hactoberfest
Tags: hacktoberfest
Published: 2020-11-08 14:15:18

<!-- ✨This template is only meant to get your ideas going, so please feel free to write your own title, structure, and words! ✨ -->


### [Intro Heading]
<!-- If you are new to the DEV community, introduce yourself and share a bit about why you joined DEV and decided to participate in Hacktoberfest this year.  --> 
### Background

<!-- Are you brand new to open source? What about coding in general? Tell us about how you got here →

### Progress

<!-- Share a bit about where you’re at in your Hacktoberfest journey. What stage are you at? How has the process been?  -->

### Contributions

<!-- This is where you can list the contributions you made and explain why you chose the projects you did. Don’t forget to add links!  -->


### Reflections
<!-- Overall, how has your Hacktoberfest 2020 experience been? If you’re a first-timer, will you participate again? What have you learned? Have you made any interesting connections? What is your next step in open source?  -->
Neofetch for Git repositories
Tags: rust, git, showdev
Published: 2020-11-08 14:05:36

---
title: Neofetch for Git repositories
published: true
description: 
tags: rust, git, showdev
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/k5wp37l5pmu5qu0bmc3c.png
---
Here is a fun little tool you might enjoy. It doesn't do much other than displaying a bunch of info about your Git Repository along side an ASCII logo of the dominant language.

Onefetch supports more than [50 different programming languages](https://github.com/o2sh/onefetch/wiki/language-Support).

Written fully in Rust, it implements Kitty, Sixel and iTerm image protocol to render graphics (images) on supported terminals --> More info [here](https://github.com/o2sh/onefetch/wiki/Images-in-the-terminal)

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/crscxawtgkau00na9gkq.png)

I would love some feedback :)

{% github o2sh/onefetch %}
2020-11-07 | Firefox for Privacy, Backup with Rsync and 7Zip, Soccer
Tags: learninpublic, beginners, webdev, career
Published: 2020-11-08 13:48:16

---
title: "2020-11-07 | Firefox for Privacy, Backup with Rsync and 7Zip, Soccer"
description: "Summary of my day"
published: true
tags: ["LearnInPublic", "Beginners", "Webdev", "Career"]
series: "miku86 Diary"
canonical_url: "https://miku86.com/blog/day-2020-11-07"
---

I worked on my JS course for 2 hours, rewriting a lot of stuff, making it really simple.

Afterwards I had to tackle a big task: reinstalling Firefox. Actually ditching Firefox Developer Edition, because updating ([11 times last month](https://github.com/archlinux/svntogit-community/commits/packages/firefox-developer-edition/trunk)) is very annoying and sometimes stuff breaks. The default Firefox package had only [3 updates last month](https://github.com/archlinux/svntogit-packages/commits/packages/firefox/trunk) and is just one version behind, that's okay.

Then I hardened my Firefox to be more privacy focused. Here you can see my [privacy settings and extensions](https://github.com/miku86/dotfiles/tree/master/firefox). Keeping up with the newest privacy settings is hard. From now on I just wait for new discoveries on reddit.

I also refined my new backup approach. I've written a simple [rsync](https://wiki.archlinux.org/index.php/Rsync) script that creates a backup folder. Then I compress and encrypt the folder with 7zip. Duration is around 10 minutes. Next step is to send it to my cloud storage. Alex had the great idea to [use an USB stick](https://dev.to/alxtrnr/comment/17kma) and I will add this to my approach, because sending 10GB-20GB over the wire is slow. I will also have a look at buying a SD card, so I will probably send it to my Raspberry Pi.

In the evening I watched some soccer for leisure.
Functions should have same level of abstraction
Tags: android, kotlin, codequality, cleancode
Published: 2020-11-08 13:37:42

Yesterday I've been reading Clean Code, by Robert C. Martin, also known as Uncle Bob, and one of the rules really got my attention:

> In order to make sure our functions are doing “one thing,” we need to make sure that the statements within our function are all at the same level of abstraction. 

I'd go even step further, and apply this rule not only to a function, but also to a class or specific block of code. Now, this rule is quite important, and it's easy to ignore this code structure requirement. Mixing levels of abstraction within a function or a class is always confusing. Readers may not be able to tell whether a particular expression is an essential concept or a detail. 

> Switching between levels of abstraction makes code harder to read. While reading the code you have to mentally construct the missing abstractions by trying to find groups of statements which belong together.

Quote from [principles-wiki][df1]

This rule requires a coder to have a discipline. For example, once you realise your class is missing a value, that is easily obtained by a .map function, you will be tempted to do the mapping in your root class like this.
```kotlin
class Presenter(private val repository: Repository) {
    fun getMembersAge() = getMembers().map(it.age)
    private fun getMembers() = repository.getMembers()
}
```
This is wrong. In this case, there should be a class strictly responsible for that mapping, and work should be decoupled from the Presenter class. Root class, in our case Presenter class, should **not** know about the .map function being invoked.
```kotlin
class Mapper {
    fun map(members: List<Member>) = members.map(it.age)
}
```
```kotlin
class Presenter(
    private val mapper: Mapper, 
    private val repository: Repository
) {
    fun getMembersAge() = mapper.map(getMembers())
    private fun getMembers() = repository.getMembers()
}
```
_Code examples in this article do not represent real world examples. Presenter layer should not be injected with a mapper and naming is simplified._

This kind of rule, not only does make our code cleaner and more readable, but it also opens a lot of room for a quality unit testing and higher unit test coverage.

[df1]: <http://principles-wiki.net/principles:single_level_of_abstraction#:~:text=All%20statements%20of%20a%20method,will%20result%20in%20smaller%20methods.>
Day 45 of #100DaysOfCode: Python Web Crawler for Beginners: Parse Data from the Static Website
Tags: python, webdev, 100daysofcode, software
Published: 2020-11-08 13:36:16


## Introduction
The web crawler is an efficient way to get the data if we don’t have REST APIs or libraries to retrieved data.

What we the most want to do with web crawlers is retrieving data in real-time. In a program of a web crawler, it usually sends a request to the target website as a flight company, EC website, or galleries of products. Then parse the response from the website and extract the information we expect.

We can present data in different ways as web pages, APIs, or an executable file. There are some cases I used web crawling to solve.
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/7dxwevaoos9cy36czxoq.png)

This article introduces the following topics.
1. Introduction
2. Implement a web crawler program for static websites

## Details
Please refer to my [article](https://medium.com/a-layman/python-web-crawler-for-beginners-parse-data-from-the-static-website-2955b37e1ae6)

## Articles
There are some of my articles and released projects. Feel free to check if you like! 
* [My blog-posts for software developing](https://medium.com/a-layman)
* [Facebook page](https://www.facebook.com/imalayman)
* [My web resume](https://jenhsuan.github.io/ALayman/cover.html)
* [Twitter bot](https://twitter.com/ALayman84368087)
* [Side project - Daily Learning](https://daily-learning.herokuapp.com/)
Daily Developer Jokes - Sunday, Nov 8, 2020
Tags: jokes, dailydeveloperjokes
Published: 2020-11-08 13:00:28

---
title: "Daily Developer Jokes - Sunday, Nov 8, 2020"
description: "Check out today's daily developer joke! (a project by Fred Adams at xtrp.io)"
series: "Daily Developer Jokes"
cover_image: "https://private.xtrp.io/projects/DailyDeveloperJokes/thumbnail_generator/?date=Sunday%2C%20Nov%208%2C%202020"
published: true
tags: #jokes, #dailydeveloperjokes
---

Generated by Daily Developer Jokes, a project by [Fred Adams](https://xtrp.io/) ([@xtrp](https://dev.to/xtrp) on DEV)

___Read about Daily Developer Jokes on [this blog post](https://xtrp.io/blog/2020/01/12/daily-jokes-bot-release/), and check out the [Daily Developer Jokes Website](https://dailydeveloperjokes.github.io/).___
### Today's Joke is...
![Joke Image](https://private.xtrp.io/projects/DailyDeveloperJokes/public_image_server/images/5e12592f4bd15.png)

---
*Have a joke idea for a future post? Email ___[xtrp@xtrp.io](mailto:xtrp@xtrp.io)___ with your suggestions!*

*This joke comes from [Dad-Jokes GitHub Repo by Wes Bos](https://github.com/wesbos/dad-jokes) (thank you!), whose owner has given me permission to use this joke with credit.*

<!-- 
Joke text:
___Q:___ Why do Java developers wear glasses?

___A:___ Because they don't C#!
 -->
Many things to learn
Tags: learning, continuouslearning, tech
Published: 2020-11-08 12:27:18

As a long-term software engineer, I've been in the habit of continuous learning. Years ago, I dropped **Delphi/Pascal** and, was deciding between **Java** path or **C#**. That day, I decided to drive **C#** road. Firstly, I developed on **WinForms**, later on **ASP.NET Web Forms**. This continued with **ASP.NET MVC**, **Web API**, **Single Web Pages**, **JavaScript**, **different databases**, **Linux**, various **protocols** and so on.

Well, I am not tired of learning new things. Every new technology or language I learned, became useful in the following steps. They made my work easier. But, hey, the market is still greedy for new things, even more than past. Now, I am faced with more variety of things to learn: front end technologies like React.js, Vue.js, Svelte, all kind of trending databases, various cloud platforms from Microsoft, Amazon, Google and even IBM, programming languages like Go, Python, Dart, Ruby, TypeScript and PHP, mobile platforms including Android and iOS as traditional ones and, PWA and Flutter as new trends. Not to forget practices like automated test, AI and design patterns.

Ok, I know that a single company does not use them simultaneously. However, when you change your company or when you hire new developers for your team, you may be not lucky enough to meet tech stack which is more familiar to you. Chances are that the new team uses an entire new technology practice than what ever you used to.

It's not an impossible mission to learn new technologies or methodologies. However, it's a bit overwhelming. It's a bit stressful to decide a correct priority, and keep it in your daily schedule along with other tasks.

BTW, did you noticed that the version control system has not witnessed a fundamental change in recent years? It's a long time that git has not been replaced by any competitor.
Designing A Website For Non-profit
Tags: computerscience, webdev, wordpress, design
Published: 2020-11-08 11:54:14

Recently I found an opportunity to help a local non-profit organization to revamp their WordPress site with a new theme that they have purchased. Nothing too difficult here since we are using visual editors (Elementor, and some custom CSS when functionalities are limited) and a purchased theme has already provided many preset elements to work with. However, as a first-timer, there were lessons to be learned in the process of communicating with the beneficiary and ultimately producing a design that is both aesthetic and functional.

I am still in the midst of working on that website, so today I would like to just share one part of the journey: preparation.

---
### Preparation
Upon reflection, I think I made the mistake of not laying out the plan well enough. There were reference websites that the organization wishes to emulate. There were also some pointers given as to what needs to be included on the website. I started working on the new website based on the impression that I was getting from those reference sites and also some of the requirements that were provided. Soon I had to get back and forth with the in-charge because I did not gather all the resources I needed for the job.

Here I would like to summarise some of the things to look out for, to better prepare myself in the future.

---
##### Basic Information
- Login details
- Project timelines
- Communication channels and liaison personnel
- Any other team members and distribution of responsibilities 

##### Essential Assets
- Organizational logo/icon in different formats
- High-resolution images of organization events etc
- Portraits/photos of members in the organization
- Any other images/icons to be used 

##### Essential Textual Information
- Slogans/taglines
- Mission, Vision
- Organization backstory
- Services provided
- Member description
- Contact information
- Social media handles
- Past articles and posts

##### Design Choices
- Color palette
- Sections to be on the homepage
- Items on the header/menu
- Page structure (what pages are required)

---

That's all for now:smile:
JS ES6 Object Destructuring
Tags: javascript, computerscience, codenewbie, codequality
Published: 2020-11-08 08:12:08

# Intro

> Object De-structuring is available to easily breakdown an object to variable since the release of ES6.Before de-structuring, an object's property should be assigned to a variable separately. 

    const  user = {
    	    name:'John',
    	    age:36,
    	    address:{
			    city:'NY',
			    country:'USA'
		    }
    }
    const  name = user.name;
    const  city = user.address.city; 

# Using Destructure
When object de-structuring, we may use brackets with relevant properties that we may want to de-structure.If a property is in a nested object, it should follow that order also.Whenever we need to rename the variable which is going to restructure, we can add that after a colon.See below example

    const user = {
       name:'John',
       age:36,
       address:{
	       city:'NY',
	       country:'USA'
	   }
    }
    const {name,age,address:{city:cityName}} = user;
    console.log(name,age,cityName)

Here in the line of `const {name,age,address:{city:cityName}} = user;` , we de-structure name age as their property name appears in the user object.In order to get city out od the user object, we've to go inside the address object inside the user object.So the same kind of syntax apply there.In that case you may see `address:{city:cityName}` . here the `city:cityName` declares a variable city as  cityName.so whenever we want to address the city we use cityName hereafter.

## Using Spread (...) Operator

We may want to copy several properties as variable and other remaining one's as a whole new object.We can acheive that like below with spread operator

    const user = {
      name:'John',
      age:36,
      address:{
	      city:'NY',
	      country:'USA'
	      }
      }
      const {name,age,...rest} = user;
      console.log(name,age,rest)

In here the `...rest` part takes the remaining part of the user object which was not de-structured and creates a variable with them called rest

## Shallow Copying an object with De-structuring

We all know that Objects in JS are immutable by design.So occasionally we may want to make clones of object(s).Following syntax creates a clone of the user object. p.s : This will only create a shallow copy,If want to create deep copy, may want to use load ash's _.coneDeep(obj) or JSON.parse(JSON.stringify(obj)) or any other library method or native method

    const user = {
	        name:'John',
	        age:36,
	        address:{
		        city:'NY',
		        country:'USA'
	        }
    }
    const userClone = {...user};
    console.log(userClone);
I'm excited ⚛️ Quarkus
Tags: webdev
Published: 2020-11-08 11:49:38

Yesterday I put on my high pressure mechanized diving suit and plunged into Graal VM.
It's a strange and alian world, believe me when I tell you this, Graal isn't just some fad, this is technology we should all (no matter your language) give a s*it about, a polyglot runtime are you kidding?! It runs Java, it runs Kotlin, Ruby, node.js most LLVM languages, Wasm and the list is much bigger than I can recall!
Not only this but Graal makes some of these languages run way more efficiently and faster than on traditional metal.

Related to this, I'm currently learning docker and shoehorning Graal into a container to develop a Kotlin and Typescript Svelte app I mentioned a couple of post a little while back that if you want a side Gig I have one for you.

Originally I was going to go for SpringBoot in Kotlin but turns out Quarkus is this alternative thing that is designed to work with GraalVM.

Quarkus describes itself as Supersonic Subatomic Java A Kubernetes Native Java stack tailored for OpenJDK HotSpot and **GraalVM**, crafted from the best of breed Java libraries and standards.

I don't know what it is but my God do I want to find out! I do know it makes Java feel modern and fresh, oh and it has hot reload so I can develop quickly... In Java... 🤷‍♂️ Astonished.
Decompose your Laravel route files
Tags: php, laravel, api, routes
Published: 2020-11-08 11:43:53

---
title: Decompose your Laravel route files
published: true
description: 
tags: php, laravel, api, routes
//cover_image: https://direct_url_to_image.jpg
---
While working with Laravel, you may encounter a scenario in which **route** files need to be **separated**.In this case you will need to make some changes in the project. This process can often become a chore, I have often faced this problem so I developed a package to help you **automate** this kind of chore.

Github link : [https://github.com/soysaltan/larasplitter](https://github.com/soysaltan/larasplitter "https://github.com/soysaltan/larasplitter")

You can install by using Composer
**composer require soysaltan/larasplitter**
Styled-components 3 ways
Tags: javascript, react, styledcomponents
Published: 2020-11-08 12:23:37

---
title: Styled-components 3 ways
published: true
date: 2020-11-08 11:43:52 UTC
tags: javascript,react,styledcomponents
canonical_url: https://stereobooster.com/posts/styled-components-3-ways/
---

## Style Objects

```jsx
const Button = styled.button((props) => ({
  color: props.color,
  border: `2px solid ${props.border}`,
  background: props.background,
}));
```

> styled-components optionally supports writing CSS as JavaScript objects instead of strings. This is particularly useful when you have existing style objects and want to gradually move to styled-components.

## Tagged Template Literals

```jsx
const Button = styled.button`
  color: ${(props) => props.color};
  border: 2px solid ${(props) => props.border};
  background: ${(props) => props.background};
`;
```

> Tagged Template Literals are a new feature in ES6. They let you define custom string interpolation rules, which is how we're able to create styled components.
>
> If you want to learn more about tagged template literals, check out Max Stoiber's article: [The magic behind 💅🏾 styled-components](https://mxstbr.blog/2016/11/styled-components-magic-explained/)

## And the third one...

But apparently, there is a third way which is not documented:

```jsx
const Button = styled.button((props) => `
  color: ${props.color};
  border: 2px solid ${props.border};
  background: ${props.background};
`);
```

When I saw it the first time, I thought this was an error and it would not work. Actually, it does. From my POV it's more readable than "Tagged Template Literals".

**[I wonder why it's not listed in the official documentation.](https://spectrum.chat/styled-components/general/styled-components-watercooler~54887141-57a9-4386-807c-ed950c4d5132?m=MTYwNDgzODQ1NTQ4MQ==
)**
PHP8 New Features #1
Tags: php8
Published: 2020-11-08 11:35:07

---
title: PHP8 New Features #1
published: true
description: 
tags: php8
//cover_image: https://direct_url_to_image.jpg
---

### PHP8 New Features #1
There is such beauty in PHP8. Nice approach to Object ergonomics. It's called 'Constructor Property Promotion'.
Nikita Popov, who made the proposal, explains here: https://lnkd.in/dCdAS87
RFC link: https://lnkd.in/dxa6_jG

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/d4bnj4eepplvvls1s2ii.png)
#codevember - 8 - Colored explosion - Made with tsParticles
Tags: codepen, javascript, showdev, html
Published: 2020-11-08 11:29:00

# Colored Explosion

**Made with [tsParticles](https://github.com/matteobruni/tsparticles)**

{% codepen https://codepen.io/matteobruni/pen/vYKzovR %}

Checkout more samples on CodePen [here](https://codepen.io/collection/DPOage)