10 асноўных інструментаў для стварэння вэб-сайтаў ASP.NET

  1. 1. Спрайт і аптымізацыя малюнкаў
  2. 2. Microsoft Ajax Minifier
  3. 3. ySlow
  4. 4. Элмах
  5. 5. Пингдом
  6. 6. Host Tracker
  7. 7. Праверка арфаграфіі HTML
  8. 8. Інтэрнэт-набор інструментаў IIS
  9. 9. LinqPad
  10. 10. .NET Reflector

Нядаўна я сабраў просты грамадскі сайт, створаны з ASP.NET для маёй кампаніі Superexpert.com , Я быў здзіўлены колькасцю бясплатных інструментаў, якія я выкарыстаў для стварэння сайта. Таму я падумаў, што было б цікава стварыць спіс неабходных інструментаў для стварэння сайтаў ASP.NET. Гэтыя прылады працуюць аднолькава добра як з ASP.NET Web Forms, так і з ASP.NET MVC.

Пасля прачытання Стыва Саудерса дзве (вельмі цудоўныя) кнігі, прысвечаныя прадукцыйнасці інтэрфейсу Высокая прадукцыйнасць вэб-сайтаў і Нават хутчэй вэб-сайты , Я быў вельмі адчувальны да прадукцыйнасці вэб - сайта. Згодна з залатым правілам выступу Souders:

«Па -першае, аптымізуйце прадукцыйнасць інтэрфейсу, потым 80% і больш часу рэакцыі канчатковых карыстальнікаў»

Вы можаце выкарыстоўваць наступныя інструменты, каб паменшыць памер малюнкаў, файлаў JavaScript і CSS-файлаў, якія выкарыстоўваюцца ў дадатку ASP.NET.

1. Спрайт і аптымізацыя малюнкаў

CSS спрайты былі ўпершыню апісаны ў артыкуле, напісаным пад назвай "Апарт-апарт" CSS-спрайты: Пацалунак у выглядзе нарэзкі малюнкаў , Пры выкарыстанні спрайтов вы аб'ядноўваеце некалькі малюнкаў, якія выкарыстоўваюцца на сайце, у адно выява. Далей вы карыстаецеся падманам CSS для адлюстравання пэўных суб-малюнкаў з аб'яднанага малюнка на вэб-старонцы.

Асноўным перавагай спрайтов з'яўляецца тое, што яны памяншаюць колькасць запытаў, неабходных для адлюстравання вэб-старонкі. Запыт аднаго малюнка хутчэй, чым запыт некалькіх малых малюнкаў. Увогуле, чым больш рэсурсаў - малюнкаў, файлаў JavaScript, файлаў CSS - яны павінны перамяшчацца па правады, тым павольней будзе ваш сайт.

Аднак большасць людзей пазбягае выкарыстання спрайтов, таму што яны патрабуюць шмат працы. Вам трэба аб'яднаць усе малюнкі і напісаць толькі правільныя правілы CSS для адлюстравання суб-малюнкаў. Платформа аптымізацыі малюнкаў Microsoft Sprite дазваляе пазбягаць усёй гэтай працы. Фреймворк аб'ядноўвае выявы для вас аўтаматычна. Акрамя таго, у склад гэтага панэлі ўваходзіць элемент кіравання ASP.NET Web Forms і памочнік ASP.NET MVC, які дазваляе лёгка адлюстроўваць суб-выявы. Вы можаце спампаваць Sprite і аптымізацыю малюнкаў з CodePlex па адрасе http://aspnet.codeplex.com/releases/view/50869 ,

Структура Sprite і Optimization Image была напісана Морганам Маклінам, які працаваў у офісе побач з маім у Microsoft. Морган быў страшным разумным стажорам з Канады, і мы абмяркоўвалі рамкі, калі ён яго будаваў (я быў вельмі рады даведацца, што ён над ім працуе).

Морган дадаў у гэтую структуру некалькі выдатных магчымасцяў. Напрыклад, структура аптымізацыі Sprite і малюнкаў падтрымлівае нешта, званае ўбудаваным малюнкам . Пры выкарыстанні ўбудоўвання малюнкаў фактычнае выява захоўваецца ў файле CSS. Вось прыклад таго, як выглядае ўстаўка малюнка:

.Home_StephenWalther_small-jpg

{

шырыня: 75px;

вышыня: 100px;

фон: URL (дадзеныя: image / png; base64, iVBORw0KGgoAAAANSUhEUgAAAEsAAABkCAIAAABB1lpeAAAAB)

GdBTUEAALGOfPtRkwAAACBjSFJNAACHDwAAjA8AAP1SAACBQAAAfXkAAOmLAAA85QAAGcxzPIV3AAAKL

s + zNfREAAAAASUVORK5CYII =) не паўтараць 0% 0%;

}

Сапраўдная выява (у дадзеным выпадку фатаграфія мяне, якая адлюстроўваецца на галоўнай старонцы сайта Superexpert.com) захоўваецца ў файле CSS.

Калі вы наведаеце сайт Superexpert.com, то загружана вельмі мала асобных малюнкаў. Напрыклад, усе выявы з чырвонай аблямоўкай на скрыншоце ніжэй карыстаюцца CSS-спрайтамі:

На жаль, ёсць некаторыя значныя Gotchas, пра якія вы павінны ведаць пры выкарыстанні Sprite і аптымізацыі малюнкаў. Існуюць абыходныя шляхі для гэтых Готч. Пра наступныя запісы ў блогу планую напісаць пра гэтыя Готчы і абыходныя шляхі.

2. Microsoft Ajax Minifier

Па магчымасці вы павінны аб'яднаць, мінімізаваць, сціскаць і кэшаваць з загалоўкам загалоўка ўсе вашы файлы JavaScript і CSS. Microsoft Ajax Minifier дазваляе лёгка памяншаць файлы JavaScript і CSS.

Не бянтэжайце мінімізацыю і сціск. Вы павінны зрабіць абодва. Па словах Souders, вы можаце паменшыць памер файла JavaScript на 20% (у сярэднім), паменшыўшы файл JavaScript пасля сціску файла.

Пры памяншэнні файла JavaScript або CSS вы выкарыстоўваеце розныя хітрыкі, каб паменшыць памер файла да сціску файла. Напрыклад, вы можаце паменшыць файл JavaScript, замяніўшы доўгія імёны зменных на кароткія імёны зменных і выдаляючы непатрэбныя прабелы і каментары. Вы можаце паменшыць файл CSS, робячы такія рэчы, як замена доўгіх імёнаў колераў, такіх як #ffffff, на больш кароткія эквіваленты, такія як #fff.

Міністратар Microsoft Ajax створаны супрацоўнікам Microsoft Рон Логан. Унутрана, гэты інструмент выкарыстоўваецца некалькімі буйнымі сайтамі Microsoft. Мы таксама выкарыстоўвалі гэты інструмент у камандзе ASP.NET. Я пераконваў Рона апублікаваць гэты інструмент на CodePlex, каб усе маглі карыстацца ім. Вы можаце спампаваць інструмент з ASP.NET Ajax на сайце і прачытайце дакументацыю па прыладзе тут ,

Я стварыў праграму ўстаноўкі для Microsoft Ajax Minifier. Пры стварэнні ўсталёўшчыка я таксама стварыў задачу зборкі Visual Studio, якая дазваляе лёгка аўтаматычна памяншаць усе вашыя файлы JavaScript і CSS, калі аўтаматычна робіце зборку ў Visual Studio. Чытаць Ajax Minifier Хуткі старт даведацца, як наладзіць задачу зборкі.

3. ySlow

ySlow інструмент гэта бясплатная дапаўненні для Firefox, створанай Yahoo, якая дазваляе праверыць прафіцыт вашага сайта. Напрыклад, вось вынікі выпрабаванняў на сайце Superexpert.com:

Вэб-сайт Superexpert.com мае агульны бал B (не ідэальны, але нядрэнны). Інструмент ySlow не ідэальны. Напрыклад, сайт Superexpert.com атрымаў нізкі ўзровень F за тое, што ён не выкарыстоўваў сетку дастаўкі кантэнту, нягледзячы на ​​тое, што сайт выкарыстоўвае Сетка дастаўкі змесціва Microsoft Ajax для файлаў JavaScript, такіх як jQuery.

Пасля публікацыі вэб-сайта ў прамым эфіры, вы хочаце, каб на сайце не было ніякіх праблем, і ён застаецца ў жывым. Я выкарыстоўваю наступныя інструменты для маніторынгу сайта Superexpert.com зараз, калі ён жывы.

4. Элмах

ELMAH выступае за модулі рэгістрацыі памылак і апрацоўшчыкі для ASP.NET . ELMAH дазваляе запісваць любыя памылкі, якія здараюцца на вашым сайце, каб вы маглі прагледзець іх у будучыні. Вы можаце спампаваць ELMAH бясплатна з Сайт праекта ELMAH ,

ELMAH выдатна працуе як з ASP.NET Web Forms, так і з ASP.NET MVC. ELMAH можна наладзіць для захоўвання памылак у розных крамах, уключаючы XML-файлы, часопіс падзей, базу дадзеных доступу, базу дадзеных SQL, базу дадзеных Oracle або ў аператыўнай памяці. Вы таксама можаце наладзіць ELMAH для адпраўкі вам паведамленняў пра памылкі, калі яны здарыцца.

Па змаўчанні вы можаце атрымаць доступ да ELMAH, запытаўшы старонку elmah.axd з сайта з усталяванай ELMAH. Вось як выглядае старонка elmah з сайта Superexpert.com (гэтая старонка абаронена паролем, бо сакрэтная інфармацыя можа быць выяўлена ў паведамленні пра памылку):

Калі вы націснеце на пэўнае паведамленне пра памылку, вы можаце праглядзець арыгінальнае паведамленне пра памылку жоўтага экрана ASP.NET (нават калі паведамленне пра памылку ніколі не адлюстроўвалася для фактычнага карыстальніка).

Я ўсталяваў ELMAH, скарыстаўшыся новым мэнэджэрам пакетаў для ASP.NET пад назвай NuGet (першапачаткова імем NuPack). Падрабязнасці пра NuGet вы можаце прачытаць у наступным запіс у блогу Скот Гатры. Ты можаш спампаваць NuGet з CodePlex.

5. Пингдом

Я выкарыстоўваю Pingdom, каб пераканацца, што сайт Superexpert.com заўсёды працуе. Вы можаце зарэгістравацца ў Pingdom, наведаўшы Pingdom.com , Вы можаце выкарыстоўваць Pingdom для маніторынгу аднаго сайта бясплатна.

На вэб-сайце Pingdom вы наладжваеце частату таго, што ваш вэб-сайт пінгуецца. Я пацвярджаю, што сайт Superexpert.com працуе кожныя 5 хвілін. У мяне паслуга Pingdom правярае, што яна можа атрымаць радок "Звязацца з намі" з галоўнай старонкі сайта.

У мяне паслуга Pingdom правярае, што яна можа атрымаць радок Звязацца з намі з галоўнай старонкі сайта

Калі ваш сайт не працуе, вы можаце наладзіць Pingdom так, каб ён адпраўляў паведамленне электроннай пошты, Twitter, SMS або iPhone. Я выкарыстоўваю прыкладанне Pingdom для iPhone, які выглядае наступным чынам:

Я выкарыстоўваю прыкладанне Pingdom для iPhone, які выглядае наступным чынам:

6. Host Tracker

Калі ваш сайт зніжаецца, вам патрэбны нейкі спосаб вызначыць, ці з'яўляецца гэта праблема ў вашай лакальнай сетцы, ці ваш вэб-сайт не працуе для ўсіх. Я выкарыстоўваю сайт пад назвай Host-Tracker.com, каб праверыць, наколькі дрэнна сайт працуе.

Вось што паказвае вэб-сайт Host-Tracker для вэб-сайта Superexpert.com, калі сайт можа быць паспяхова пінгаваны з любой кропкі свету:

com, калі сайт можа быць паспяхова пінгаваны з любой кропкі свету:

Звярніце ўвагу, што Host-Tracker абнаўляе вэб-сайт Superexpert.com з 68 месцаў, у тым ліку Рубе, Францыя і Scranton, PA.

Я маю на ўвазе адладку ў самым шырокім сэнсе. Пры будаўніцтве сайта я выкарыстоўваю наступныя інструменты, каб пераканацца, што я не памыляўся.

7. Праверка арфаграфіі HTML

Чаму ў Visual Studio няма убудаванай праверкі арфаграфіі? Не ведаю - я заўсёды знаходзіў гэты загадкавы. На шчасце, аднак, былы член каманды ASP.NET напісаў бясплатны праверка арфаграфіі, якую можна выкарыстоўваць са сваімі старонкамі ASP.NET.

Я лічу, праверка арфаграфіі неабходная. Лёгка падмануць сябе, што вы здольныя да дасканаласці арфаграфіі. Я заўсёды вельмі збянтэжаны, калі я на самой справе запускаю інструмент праверкі арфаграфіі і выяўляю ўсе свае памылкі арфаграфіі.

Самы хуткі спосаб дадання пашырэння HTML Spell Checker у Visual Studio - гэта выбраць пункт меню Tools, Extension Manager у Visual Studio. Націсніце на Інтэрнэт-галерэю і пошук праверкі арфаграфіі HTML:

8. Інтэрнэт-набор інструментаў IIS

Калі людзі не могуць знайсці ваш сайт праз Google, то вам нават не трэба будзе яго ствараць. Microsoft мае вялікае пашырэнне для IIS пад назвай Набор інструментаў для аптымізацыі пошукавых сістэм IIS што вы можаце выкарыстоўваць для выяўлення праблемы з вашым сайтам, які можа пашкодзіць яго рангу. Вы таксама можаце выкарыстоўваць гэты інструмент для хуткага стварэння карты сайта для вашага сайта, які вы можаце адправіць у Google або Bing. Вы нават можаце стварыць карту сайта для сайта ASP.NET MVC.

Вось як выглядае агляд справаздачы для сайта Superexpert.com:

com:

Звярніце ўвагу, што на сайце Sueprexpert.com было парушэнняў. Напрыклад, існуе 65 выпадкаў, калі старонка мае няправільную гіперспасылку. Вы можаце прапрацаваць гэтыя парушэнні для вызначэння дакладнай старонкі і месца, дзе адбываюцца гэтыя парушэнні.

9. LinqPad

Калі ваш сайт ASP.NET звяртаецца да базы дадзеных, то вы павінны выкарыстоўваць LINQ для асоб з Entity Framework. Выкарыстанне LINQ ўключае ў сябе нейкую магію. Запыты LINQ, напісаныя на C #, пераўтворацца ў SQL-запыты. Калі вы не асцярожныя адносна таго, як пішаце запыты LINQ, вы можаце ненаўмысна стварыць сапраўды дрэнна выкананы сайт.

LinqPad гэта бясплатна
інструмент, які дазваляе эксперыментаваць з запытамі LINQ. Ён нават працуе з Microsoft SQL CE 4 і Azure.

Вы можаце выкарыстоўваць LinqPad для выканання запыту LINQ to Entities і ўбачыць вынікі. Вы таксама можаце выкарыстоўваць яго, каб убачыць выніковы SQL, які будзе выкананы ў базе дадзеных:

10. .NET Reflector

Я выкарыстоўваю .NET Reflector штодня. Інструмент .NET Reflector дазваляе прымаць любую зборку і разбіраць зборку ў код C # ці VB.NET. Вы можаце выкарыстоўваць .NET Reflector, каб убачыць "Зыходны код" зборкі, нават калі ў вас няма фактычнага зыходнага кода. Вы можаце спампаваць бясплатную версію .NET Reflector з Redgate сайт ,

Я выкарыстоўваю .NET Reflector у першую чаргу, каб дапамагчы мне зразумець, што код робіць унутры. Напрыклад, я выкарыстаў .NET Reflector з сістэмай аптымізацыі Sprite і выяваў, каб лепш зразумець, як працуе дапаможнік MVC Image. Вось частка разабранага кода класа Памочнік Image:

Вось частка разабранага кода класа Памочнік Image:

У гэтым запісе ў блогу я абмяркоўваў некалькі інструментаў, якія я выкарыстаў для стварэння сайта Superexpert.com. Гэта інструменты, якія я выкарыстоўваю для паляпшэння прадукцыйнасці, паляпшэння SEO, праверкі часу працы або адладкі сайта Superexpert.com. Усе інструменты, абмеркаваныя ў гэтым запісе ў блогу, бясплатныя. Акрамя таго, усе гэтыя інструменты працуюць як з вэб-формамі ASP.NET, так і з ASP.NET MVC.

Дайце мне ведаць, ці ёсць якія-небудзь інструменты, якія вы выкарыстоўваеце штодня пры стварэнні вэб-сайтаў ASP.NET.