Pague o aluguel

Pague o aluguel
Trabalhando efetivamente com código em débito

Eu sou…
• Desenvolvedor;
• PHP, Ruby, Python e JavaScript. Um pouco de Java e C# (Xamarin);
• Trabalho na BriteCore;
• Trabalho remotamente desde 2016;
• @nelson_senna

“…fazendo as
coisas de
maneira rápida e
suja cria-se um
débito técnico…”
–Martin Fowler

Débito técnico é…
Código usado para protótipos, provas de
conceito ou até uma pequena correção.

Classiﬁcação de débito técnico
Imprudente Prudente
Deliberado
Negligente
“Não temos tempo!” “Precisamos entregar,
depois vemos isso.”
“O que é OOD? OOP? Design?”
“Agora sabemos que
devíamos ter feito isso.”

Débito técnico é…
Código que deveríamos jogar fora…

–Martin Fowler
“Como uma dívida
ﬁnanceira, o débito
técnico incorre em
pagamentos de juros,
que vêm na forma de
esforço extra que
temos que fazer no
futuro...”

“…esse código muitas
vezes ganha vida
própria… Funciona,
então por que
consertar?”
–Brian Foote

E algum tempo e “ifs”
depois…

“Um Big Ball of Mud
tem estrutura
desordenada,
espalhada, desleixada,
remendada e, código
espaguete”
–Brian Foote

Big Ball of Mud
• Os nomes de variáveis e funções pouco informativos ou enganosos
• Uso extensivo de variáveis globais
• Métodos com longas listas de parâmetros mal deﬁnidos
• Métodos longos e complicados e, executam várias tarefas não relacionadas
• Código duplicado
• O ﬂuxo de controle é difícil de entender e difícil de seguir
• A intenção do programador é quase impossível de discernir
• O código é simplesmente ilegível e espalhado sem modularização clara
• O código exibe os sinais inconfundíveis de patch após patch nas mãos de vários
mantenedores, cada um dos quais mal entendeu as conseqüências do que estava
fazendo
• Sem documentação

Big Ball of Mud
A estrutura rígida que faz com que o
código ﬁque difícil de entender, caro e
suscetível a erros.

“Da sinonímia dos termos organização e
conhecimento, retira-se que a síntese mais
produtiva, ou mais instigadora, para a
construção de uma idéia acerca da
organização do conhecimento na sociedade é
aquela que abstrai de organização, pelo verbo
organizar, os sentidos de ORGANIZAR, que
são os seguintes: estabelecer as bases de;
arrumar de determinado modo; colocar em
certa ordem.”
–Renato Rocha Souza

Entender é…
Organizar ideias e conceitos, atribuindo
uma ordem, classiﬁcando os mesmos.

Então…
if (organizacao) {
entendimento++;
bigBallOfMud--;
}

Nome é…
Palavra ou locução com que se designa
uma classe de coisas, pessoas, animais,
um lugar, um acidente geográﬁco, um
astro etc.

“Existem duas coisas
difíceis em computação:
invalidação de cache e
nomear coisas.”
–Phil Karlton

Nomes são descobertos!
Sem nome
Sem
sentido
Honesto
Honesto e
Completo
Faz o que o
nome diz
Intenção
↪ ↪ ↪ ↪ ↪ ↪
Abstração de
domínio

Nomes são descobertos!
Sem nome
Sem
sentido
Honesto
Honesto e
Completo
Faz o que o
nome diz
Intenção
↪ ↪ ↪ ↪ ↪ ↪
Abstração de
domínio
@arlobelshee

var rootJquery,
// A simple way to check for HTML strings
// Prioritize #id over <tag> to avoid XSS via location.hash (#9521)
// Strict HTML recognition (#11290: must start with <)
// Shortcut simple #id case for speed
rquickExpr = /^(?:s*(<[wW]+>)[^>]*|#([w-]+))$/,
init = jQuery.fn.init = function( selector, context, root ) {
var match, elem;
// HANDLE: $(""), $(null), $(undefined), $(false)
if (!selector) {
return this;
}
// Method init() accepts an alternate rootjQuery
// so migrate can support jQuery.sub (gh-2101)
root = root || rootjQuery;
// Handle HTML strings
if (typeof selector === "string") {
if (selector[0] === "<" && selector[selector.length - 1] === ">" && selector.length >= 3) {
// Assume that strings that start and end with <> are HTML and skip the regex check
match = [null, selector, null];
} else {
match = rquickExpr.exec( selector );
}
…
// HANDLE: $(expr, $(...))
} else if (!context || context.jquery) {
return (context || root).find(selector);
// HANDLE: $(expr, context)
// (which is just equivalent to: $(context).find(expr)
} else {
return this.constructor(context).find(selector);
}
// HANDLE: $(DOMElement)
} else if (selector.nodeType) {
this[0] = selector;
this.length = 1;
return this;
// HANDLE: $(function)
// Shortcut for document ready
} else if (isFunction(selector)) {
return root.ready !== undefined ? root.ready(selector) :
// Execute immediately if ready is not present
selector(jQuery);
}
return jQuery.makeArray(selector, this);
};
// Match html or make sure no context is specified for #id
if (match && (match[1] || !context)) {
// HANDLE: $(html) -> $(array)
if (match[1]) {
context = context instanceof jQuery ? context[0] : context;
// Option to run scripts is true for back-compat
// Intentionally let the error be thrown if parseHTML is not present
jQuery.merge(this, jQuery.parseHTML(
match[1],
context && context.nodeType ? context.ownerDocument || context : document,
true
));
// HANDLE: $(html, props)
if (rsingleTag.test(match[1]) && jQuery.isPlainObject(context)) {
for (match in context) {
// Properties of context are called as methods if possible
if (isFunction(this[match])) {
this[match](context[match]);
// ...and otherwise set as attributes
} else {
this.attr(match, context[match]);
}
}
}
return this;
// HANDLE: $(#id)
} else {
elem = document.getElementById(match[2]);
if (elem) {
// Inject the element directly into the jQuery object
this[0] = elem;
this.length = 1;
}
return this;
}

jQuery( selector [, context ] )
jQuery( element )
jQuery( elementArray )
jQuery( object )
jQuery( selection )
jQuery()
jQuery( html [, ownerDocument ] )
jQuery( html, attributes )
jQuery( callback )

var rootJquery,
// A simple way to check for HTML strings
// Prioritize #id over <tag> to avoid XSS via location.hash (#9521)
// Strict HTML recognition (#11290: must start with <)
// Shortcut simple #id case for speed
rquickExpr = /^(?:s*(<[wW]+>)[^>]*|#([w-]+))$/,
init = jQuery.fn.init = function( selector, context, root ) {
var match, elem;
// HANDLE: $(""), $(null), $(undefined), $(false)
if (!selector) {
return this;
}
// Method init() accepts an alternate rootjQuery
// so migrate can support jQuery.sub (gh-2101)
root = root || rootjQuery;
// Handle HTML strings
if (typeof selector === "string") {
} else {
}
…
// HANDLE: $(expr, $(...))
return (context || root).find(selector);
} else {
return this.constructor(context).find(selector);
}
// HANDLE: $(DOMElement)
} else if (selector.nodeType) {
this[0] = selector;
this.length = 1;
return this;
// HANDLE: $(function)
// Shortcut for document ready
} else if (isFunction(selector)) {
return root.ready !== undefined ? root.ready(selector) :
// Execute immediately if ready is not present
selector(jQuery);
}
return jQuery.makeArray(selector, this);
};
if (match[1]) {
match[1],
true
));
} else {
}
}
}
return this;
// HANDLE: $(#id)
} else {
elem = document.getElementById(match[2]);
if (elem) {
// Inject the element directly into the jQuery object
this[0] = elem;
this.length = 1;
}
return this;
}
Sem nome!

var handleHTMLStrings = function (selector, context, root) {
} else {
}
if (match[1]) {
// ...
// ...
}
return this;
// HANDLE: $(#id)
} else {
// ...
}
// HANDLE: $(expr, $(...))
// ...
} else {
// ...
}
}
Sem sentido!

var handleHTMLStrings = function (selector, context, root) {
} else {
}
if (match[1]) {
// ...
// ...
}
return this;
// HANDLE: $(#id)
} else {
// ...
}
// HANDLE: $(expr, $(...))
// ...
} else {
// ...
}
}

var handleHTMLStringsAndElementIds = function (selector, context, root) {
} else {
}
if (match[1]) {
// ...
// ...
}
return this;
// HANDLE: $(#id)
} else {
// ...
}
// HANDLE: $(expr, $(...))
// ...
} else {
// ...
}
}
Honesto!

var handleHTMLStringsAndElementIds = function (selector, context, root) {
} else {
}
if (match[1]) {
// ...
// ...
}
return this;
// HANDLE: $(#id)
} else {
// ...
}
// HANDLE: $(expr, $(...))
// ...
} else {
// ...
}
}

var handleHTMLStringsAndElementIdsAndCSSSelectors = function (selector, context, root) {
} else {
}
if (match[1]) {
// ...
// ...
}
return this;
// HANDLE: $(#id)
} else {
// ...
}
// HANDLE: $(expr, $(...))
// ...
} else {
// ...
}
}
Honesto e
completo!

handleHTMLStringsAndElementIdsAndCSSSelectors = function (selector, context, root)

handleHTMLStrings = function (selector, context, root)

handleElementIds = function (selector, context, root)

handleElementIds = function (selector, context, root)
handleCSSSelectors = function (selector, context, root)

var handleHTMLStrings = function (match, context, root) {
if (match[1]) {
match[1],
true
));
} else {
}
}
}
return this;
}
}
}
Sem sentido?

Características de bons nomes de métodos
• Use verbos*;
• Sem abreviações;
• Conciso (mas, não muito!);
• Use perguntas quando o método retornar um boolean (isEmpty(), canDo());
• Não use “And” e “Or” nos seus nomes;
• Não deixe o nome redundante com o argumento 
($list->addItem($item));
• Não deixe o nome redundante com quem chama 
($list->addToList($item));

var buildFromHTMLString = function (match, context, root) {
if (match[1]) {
match[1],
true
));
} else {
}
}
}
return this;
}
}
}

Temos um bom nome?
• Use verbos* √
• Sem abreviações √
• Conciso (mas, não muito!) √
• Use perguntas quando o método retornar um boolean (isEmpty(), canDo()) √
• Não use “And” e “Or” nos seus nomes √
• Não deixe o nome redundante com o argumento √
• Não deixe o nome redundante com quem chama √

var fromHTMLString = function (match, context) {
if (match[1]) {
match[1],
true
));
} else {
}
}
}
return this;
}
}

Características de bons nomes de variáveis
• Sem abreviações;
• Conciso (mas, não muito!);
• Use perguntas quando o método retornar um boolean (isEmpty, canDo);
• Não use “And” e “Or” nos seus nomes;

Características de bons nomes de classes
• Use substantivos e adjetivos*;
• Não use muitos adjetivos (AbstractFactoryPatternBase);
• Não use “Manager”, “Helper” e “Data” nos seus nomes;
• Não use Suﬁxos do seu namespace (Service, Factory, Iterator)
• Evite usar “er”, “or”, “tion”, “sion” (ObjectFinder, DataProcessor, Conversion,
DataManipulation)

–Chris Oldwood
“So, a "DateTimeProvider", that's
basically just a clock, right?”

Características de bons nomes de variáveis
Service is the new Enzo

Concluindo…
1. Procure por lugares com mais de um nível de identação
2. Extraia e dê nome para o que ﬁzer sentido
3. Descreva o que o método realmente faz, sem vergonha, seja honesto!
4. Vá diminuindo o nome do método extraindo suas responsabilidades
5. Excesso de métodos privados para um dado contexto: Uma nova classe!
6. Procure na documentação ou fale com um amiguinho para descrever 
o problema de domínio resolvido
7. Seja feliz!

Referências
•Foto dívida: https://ﬂic.kr/p/oiBTYX
•https://martinfowler.com/bliki/TechnicalDebt.html
•https://martinfowler.com/bliki/
TechnicalDebtQuadrant.html
•http://www.laputan.org/mud/
mud.html#ThrowAwayCode
•http://www.laputan.org/mud/
•http://revista.ibict.br/ciinf/article/view/1058/1141

Pague o aluguel

Recomendados

Recomendados

Mais conteúdo relacionado

Mais procurados

Mais procurados (20)

Mais de Nelson Senna do Amaral

Mais de Nelson Senna do Amaral (10)

Pague o aluguel