WN

WN (https://www.wn.se/forum/index.php)
-   Feedback (https://www.wn.se/forum/forumdisplay.php?f=20)
-   -   Synpunkter kring portfolio (https://www.wn.se/forum/showthread.php?t=1056191)

jayzee 2012-12-29 19:03

Citat:

Ursprungligen postat av P3N (Inlägg 20458493)
Jag försökte uttrycka det försiktigt :-)

Sanningen varar alltid längst :)

Conny Westh 2012-12-30 02:21

Jag tror det skulle tillföra en del värde om någon som har koll på riktlinjerna för frontend på detaljnivå och kan hänvisa till en sån sida eller, PDF av något slag. Jag bidrog med en pdf med riklinjer ur ett användbarhetsperspektiv. Men jag jobbar inte med frontend så jag är inte tillräckligt uptodate/insatt i detaljerna för frontend. Jag utevecklar bara backend och brukar överlåta frontend till de som jobbar med det.

jayzee 2012-12-30 19:33

Personligen har jag ingen PDF att referera till, har professionellt jobbat med både front- och backend i 10+ år (bla. på Opera Software där jag fortfarande har väldigt bra kontakter) så det mesta sitter i ryggmärgen :rolleyes:

Här är dock några bra länkar:
https://developers.google.com/speed/...es/rules_intro
http://isobar-idev.github.com/code-standards/
http://taitems.github.com/Front-End-...nt-Guidelines/

P3N 2012-12-30 23:33

Citat:

Ursprungligen postat av jayzee (Inlägg 20458492)
Om vi nu pratar om pedant så verkar du ha missat att sidan körs i en <iframe>, två (!) olika jquery versioner laddas in, sidan validerar inte för 5 öre (html4 transitional), m.m. :D
Orkade inte kolla på resten efter detta, men jag skulle inte anlita denna person att göra en "professionell hemsida" åt mig om man säger så.

Ooo, btw där finns 3 jquery versioner (och jag som inte ens tycker om en) :)

Conny Westh 2012-12-31 21:18

Citat:

Ursprungligen postat av jayzee (Inlägg 20458552)
Personligen har jag ingen PDF att referera till, har professionellt jobbat med både front- och backend i 10+ år (bla. på Opera Software där jag fortfarande har väldigt bra kontakter) så det mesta sitter i ryggmärgen :rolleyes:

Här är dock några bra länkar:
https://developers.google.com/speed/...es/rules_intro
http://isobar-idev.github.com/code-standards/
http://taitems.github.com/Front-End-...nt-Guidelines/


(OBS!!! Såg att när jag har mer än ett mellanslag i rad eller tab ('\t') klipps dessa bort i mitt inlägg så källkoden jag skrivit in blir helt sjuk i inlägget, men den ser bra ut i editläget)

Jag såg på githubben att de hade en rekommendation som jag tycker är helt fel. Som jag vill kommentera.

Måsvingar ska alltid stå på egen rad när man markerar block, för att det er en tydlig linje för ögat att följa. I den ursprungliga boken om K&R C så skrevs måsvingarna på det dåliga sättet men Kernigan själv ändrade denna standard när han skrev boken om ANSI C.

Det var enmycket logisk och begriplig ändring därför att det är hart när omöjligt att följa strukturen i koden om man måste flacka med blicken till slutet på en rad för att hitta en matchande måsvinge.

På githubben så had eman motsatt rekommendation och det motsätter jag mig bestämt.

Enkelt exempel:
Citat:

// Dåligt
if (foo){
bar();
}

// Bra
if (foo)
{
bar();
}

Mer komplext exempel:
Citat:

// Dåligt
if (foo1){
bar1a();
if (foo2){
if (foo3){
bar3a();
}
else{
bar3b();
}
}
else{
bar2b();
}
}
else{
bar3b();
}

// Så här blir betydligt bättre...
if (foo1)
{
bar1a();
if (foo2)
{
if (foo3)
{
bar3a();
}
else
{
bar3b();
}
}
else
{
bar2b();
}
}
else
{
bar3b();
}
Citat:

// Se den tydliga linjen för ögat.....
if (foo1)
{
| bar1a();
| if (foo2)
| {
| | if (foo3)
| | {
| | | bar3a();
| | }
| | else
| | {
| | | bar3b();
| | }
| }
| else
| {
| | bar2b();
| }
}
else
{
| bar3b();
}

Använd alltid måsvingar för att markera vilka block. Det är ett extremt vanligt problem att man missar att lägga till måsvingarna när man lägger till en rad i koden och då får man inte den funktionalitet man önskat. Samtidigt är det betydligt svårare att snabbt öga igenom en kod och frstå vad den gör om man använder olika "format" för att skriva sin kod, var konsekvent och använd alltid måsvingar.

Citat:

// Dåligt
if (foo)
bar();

// Bra
if (foo)
{
bar();
}
Det finns ett undantag och där är om man har extremt många korta oberoende if satser (som i sig inte kan ersättas av switch/case) som i detta exempel:

Citat:

// Dåligt!
if (foo1) bar1();
if (foo2) bar2();
if (foo3) bar3(); bar7(); // bar7() Kommer alltid att exekveras,
if (foo4) bar4(); // men det är lätta att missa det.
if (foo5) bar5();
if (foo6) bar6();

// Ok! men inte idealiskt.
if (foo1) bar1();
if (foo2) bar2();
if (foo3) bar3();
if (foo4) bar4();
if (foo5) bar5();
if (foo6) bar6();
Men såna här villkorssamlingar är inte så vanliga och man ska använda dem med försiktighet. För lägger man till en sats till på samma rad så kommer den alltid att exekveras och det var kanske inte vad man tänkt.

Unik 2013-01-01 06:54

Ja ska tänka på allt ni skrev och försöka göra det bättre till nästa gång :)!

jonssondesign 2013-01-01 11:57

Jag skriver alltid första måsvingen precis efter ... vad man nu kallar det ... (frågan/bestämmelsen?), och en precis i slutet av blocket på en egen rad.

HTML-kod:

Såhär gör jag:
---------------------
if (foo){
        bar();
};

eller

.wrapper {
        background:#000;
}

Har alltid gjort, och kommer alltid göra, oavsett.

Tidigare skrev jag såhär (dock bara när jag skrev css):

HTML-kod:

.wrapper {background:#000;}
Man såg mycket mer kod på ett mindre utrymme, och man slapp scrolla så mycket.

Nu skriver jag dock alltid:

HTML-kod:

.wrapper {
        background:#000;
}

Att lägga varje måsvinge på enskilda rader tar bara inte längre tid, det tar även större plats (större filer), och man får himla lite kod per "sida", så man måste scrolla himla massa.

Är man inte gammal och trött, så tror jag mitt sett fungerar lika bra som connys. :)

Conny Westh 2013-01-01 17:14

Om du gör så här så ser det betydligt proprare ut:

Kod:

Såhär gör jag:
---------------------
if (foo)
{
        bar();
};

eller

.wrapper
{
        background:#000;
}


Det blir tydligare ändå om du har mer komplex kod:

Kod:

// Dåligt
if (foo1){
        bar1a();
        if (foo2){
                if (foo3){
                        bar3a();
                }
                else{
                        bar3b();
                }
        }
        else{
                bar2b();
        }
}
else{
        bar3b();
}

// Så här blir betydligt bättre...
if (foo1)
{
        bar1a();
        if (foo2)
        {
                if (foo3)
                {
                        bar3a();
                }
                else
                {
                        bar3b();
                }
        }
        else
        {
                bar2b();
        }
}
else
{
        bar3b();
}


jonssondesign 2013-01-01 17:18

Sure, jag kan hålla med om att det ser bättre ut med mer komplex kod. Men annars håller jag mig alltid till mitt gamla vanliga sätt :)

P3N 2013-01-02 01:20

Jag kör med måsen direkt efter och utnyttjar tab för att hålla koll på i vilken div, if sats eller vad det nu är.

Provade att köra som Conny tycker ett tag men blev så himla långt och kändes onödigt när tabbarna ändå strukturerar upp det. Själv tycker jag det blir för ostrukturerat och spretigt med att inte ha den direkt efter. Men är nog en vanesak också.


Alla tider är GMT +2. Klockan är nu 01:12.

Programvara från: vBulletin® Version 3.8.2
Copyright ©2000 - 2025, Jelsoft Enterprises Ltd.
Svensk översättning av: Anders Pettersson