Diez herramientas esenciales para crear sitios web ASP.NET

Diez herramientas esenciales para crear sitios web ASP NET

Recientemente, utilizamos ASP NET para crear un sitio web público simple *** para la empresa (la dirección del sitio web en este). En el proceso, se utiliza una gran cantidad de herramientas gratuitas. Sería muy interesante resumir las herramientas necesarias para crear sitios web ASP NET. Estas herramientas admiten tanto ASP NET Web Forms como ASP NET MVC

Herramientas de rendimiento <. /p>

Después de leer dos libros sobre el rendimiento front-end de un sitio web (estos dos excelentes libros son "Sitios web de alto rendimiento" y "Sitios web aún más rápidos" de Steve Souders), tengo un profundo conocimiento del El rendimiento del front-end es muy sensible. Según la regla de oro del rendimiento de Steve Souders

"Primero debes optimizar el rendimiento del front-end. El tiempo de respuesta del usuario final se dedica cada vez más a esta área. " Puede utilizar las siguientes herramientas para reducir las aplicaciones ASP NET y el tamaño de los archivos JavaScript y CSS

Sprite and Image Optimization Framework

En un artículo por A List Apart (El título de este artículo es Sprites CSS El beso de la muerte de Image Slicing. Para obtener más información, consúltelo). Los sprites CSS se mencionaron por primera vez Cuando usas sprites, debes fusionar varias imágenes utilizadas por. un sitio web en una sola imagen y luego mostrarla en una página web Utilice trucos CSS para mostrar "subimágenes" específicas

La principal ventaja de los sprites es que pueden reducir efectivamente la cantidad de solicitudes al mostrarlos. una página web solicitar una imagen grande es más rápido que solicitar varias imágenes pequeñas. En términos generales, cuantos más recursos (imágenes, archivos JavaScript, archivos CSS) se transmitan a través del cable de red, más lento será su sitio web.

Pero la mayoría de las personas son reacias a usar sprites porque el uso de sprites requiere mucho trabajo. Para fusionar todas las imágenes y luego escribir las reglas CSS apropiadas para mostrar las subimágenes, el marco de optimización de imágenes y sprites de Microsoft puede ahorrar. Este marco puede fusionar automáticamente las imágenes. Además, este marco también incluye un control de formularios web ASP NET y un asistente ASP NET MVC que facilita la visualización de sprites. Marco de CodePlex

El marco de optimización de imágenes y sprites fue escrito por Man McClean en su oficina de Microsoft y Mi oficina está al lado de Man, un tipo muy inteligente que era pasante en Canadá y discutimos el marco juntos. mientras lo estaba construyendo (hasta donde yo sé, todavía lo está desarrollando)

Man ha agregado algunas características avanzadas a este marco. Por ejemplo, Sprite and Image Optimization Framework admite la "incrustación de imágenes". Si utiliza "imagen integrada", la imagen real se almacena en el archivo CSS, que es una "imagen

ejemplo de inserción"

Inicio_StephenWalther_ *** todo jpg ? { ? ? ancho: px; ? alto: px; ? fondo:?url(data:image/png; base iVBORw KGgoAAAANSUhEUgAAAEsAAABkCAIAAABB lpeAAAAB ? GdBTUEAALGOfPtRkwAAACBjSFJNAACHDwAAjA SAACBQAAA fXk AAOmLAAA QAAGcxzPIV AAAKL ? s zNfREAAAAASUVORK CYII=)?no repetir } ? Si navega por el sitio web de Superexpert, encontrará que hay muy pocas imágenes individuales que se pueden descargar. En la captura de pantalla a continuación, todas las imágenes con cuadros rojos utilizan sprites CSS

Desafortunadamente. Hay algunas "trampas" a las que se debe prestar atención al usar Sprite y Image Optimization Framework. Para evitar estas "trampas", también hay algunos trabajos periféricos que se deben realizar. en detalle en mis artículos futuros Qué son y cómo solucionar estos "errores"

Microsoft Ajax Minifier

Siempre que deba fusionar la compresión minificada y el almacenamiento en caché a través del "encabezado del futuro lejano". Todos los archivos JavaScript y CSS Microsoft Ajax Minifier facilita la minimización de archivos JavaScript y CSS

No confundas la minimización con la compresión. Según Souders, necesitarás hacer ambas cosas. Después de comprimir un archivo JavaScript, puedes hacerlo. también reduzca el tamaño (promedio) minimizándolo

Cuando minimiza un archivo JavaScript o un archivo CSS, puede utilizar varias técnicas para minimizar el tamaño del archivo antes de comprimirlo. a JavaScript reemplazando nombres largos de variables JavaScript con nombres cortos de variables JavaScript y eliminando espacios en blanco y comentarios innecesarios. También puede formas de minimizar archivos CSS, como reemplazar nombres de colores largos (#fffff) con nombres de colores cortos (#fff)

Microsoft Ajax Minifier fue desarrollado por el empleado de Microsoft Ron Logan y es utilizado internamente por varios sitios web de Microsoft a gran escala. También usamos esta herramienta en el equipo de ASP NET. Creo que Ron puede publicar esta herramienta en CodePlex. para que todos en el mundo puedan usar esta excelente herramienta. Puede descargarla desde el sitio Herramientas ASP NET Ajax

Puede encontrar la documentación para esta herramienta

Creé un instalador para. Microsoft Ajax Minifier Cuando creé ese instalador, también creé una tarea de compilación de Visual Studio. Cuando Visual Studio minimiza automáticamente los archivos JavaScript y CS al compilar.

Los archivos S se vuelven más fáciles. Puede aprender cómo configurar esta tarea de generación a través del "Inicio rápido de Ajax Minifier" (para obtener más detalles, consulte "Inicio rápido de Ajax Minifier")

ySlow

. ySlow Esta herramienta es proporcionada por Yahoo. Es una extensión gratuita de Firefox que le permite probar la interfaz de su sitio web

ySlow

Aquí están los resultados de las pruebas actuales de ". Sitio web "Superexpert"

La puntuación general del sitio web "Superexpert" es "B" (no perfecto pero tampoco malo). La herramienta ySlow no es perfecta. Por ejemplo, aunque el El sitio web Superexpert utiliza una biblioteca JavaScript (por ejemplo, jQuery) Microsoft Ajax Content Delivery Neork (para obtener detalles sobre Microsoft Ajax Content Delivery Neork, consúltelo), pero aún así obtuvo una "F" porque no usó Content Delivery. Neork

Uptime

Cuando se publica un sitio web, definitivamente espera que su sitio web no encuentre ningún problema y siempre esté en funcionamiento normal. Ahora utilizo las siguientes herramientas para monitorearlo. Sitio web "superexperto" para garantizar que siempre esté en funcionamiento normal.

ELMAH

ELMAH es la abreviatura de Error Logging Modules and Handlers para ASP NET que le permite registrar cualquier error. que ocurren en su sitio web Puede volver a verificar estos errores en el futuro. Puede descargar ELMAH de forma gratuita desde el sitio web oficial del proyecto ELMAH.

ELMAH admite tanto ASP NET Web Forms como ASP NET MVC. configure ELMAH para almacenar varios errores (archivos XML, registros de eventos, bases de datos de Access, bases de datos SQL, bases de datos Oracle o RAM de la computadora). También puede pedirle a ELMAH que le envíe un mensaje de error por correo electrónico cuando ocurra un error.

De forma predeterminada, en un sitio web donde se ha instalado ELMAH, puede solicitar la página elmah axd Visite ELMAH Así es como se ve la página elmah del sitio web "Superexpert" (esta página está protegida con contraseña porque un mensaje de error puede revelar cierta información que debe conservarse confidencial)

Si hace clic en un mensaje de error, podrá ver el mensaje de error original de la pantalla amarilla de ASP NET (aunque este mensaje de error nunca se mostrará a los usuarios reales)

Utilizo el nuevo administrador de paquetes ASP NET NuGet (anteriormente llamado NuPack) para instalar ELMAH. Puede consultar acerca de NuGet en el blog de Scott Guthrie. Puede descargar NuGet desde CodePlex

Pingdom

Utilizo Pingdom para verificar que el sitio web de Superexpert esté siempre en funcionamiento normal. Puede registrar Pingdom navegando por "Pingdom". Puede utilizar Pingdom para monitorear un sitio web de forma gratuita.

En Pingdom. sitio web, puede configurar la frecuencia de ping a su sitio web. Verifique que el sitio web de Superexpert siempre esté funcionando normalmente cada minuto.

Utilice el servicio Pingdom para verificar que puede recuperar la cadena "Contáctenos" de la página de inicio de ese sitio web

Si su sitio web no funciona, puede configurar Pingdom para que envíe una alerta a través de correo electrónico Twitter SMS o iPhone Utilizo esta aplicación Pingdom para iPhone

Host Tracker

Si su sitio web no funciona, necesita alguna forma de saber si se trata de un local problema de red o si su sitio está inactivo para todos. Utilizo un sitio llamado "Host Tracker" para verificar el alcance del tiempo de inactividad de un sitio

Este es el resultado que muestra Host Tracker cuando el sitio web "Superexpert" se puede hacer ping desde todo el mundo

Tenga en cuenta que el Host Tracker proviene de una ubicación (incluidas Roubaix France y Scranton PA, etc.). Haga ping al sitio web "Superexpert"

Depuración

La "depuración" que menciono aquí tiene un significado muy amplio. Cuando construyo un sitio web utilizo las siguientes herramientas para verificar que no he cometido errores. > Corrector ortográfico HTML

¿Por qué Visual Studio no tiene un corrector ortográfico integrado? No tengo idea. Esto me parece un poco extraño, pero afortunadamente un ex miembro del equipo de ASP NET ha escrito un corrector ortográfico gratuito que puedes usar en páginas ASP NET

Encontré un corrector ortográfico Un corrector ortográfico es esencial. Pensar que tu ortografía es absolutamente perfecta es engañarte a ti mismo. Cuando realmente ejecuto el corrector ortográfico y encuentro todos mis errores ortográficos, quiero encontrar una grieta en el suelo para arrastrarme.

La forma más rápida de agregar. la extensión HTML Spell Checker para Visual Studio es seleccionar el elemento del menú "Herramientas" en Visual Studio y hacer clic en "Administrador de extensiones". Haga clic en "Galería en línea" y busque "HTML Spell Checker".

IIS SEO Toolkit

Si las personas no pueden encontrar su sitio web a través de Google, entonces es mejor no crear el sitio web. Microsoft proporciona una excelente extensión de IIS llamada "IIS Search Engine Optimization Toolkit" (para obtener detalles sobre). Kit de herramientas de optimización de motores de búsqueda de IIS, consúltelo) Puede usarlo para detectar problemas que puedan afectar la clasificación de las páginas. También puede usarlo para crear rápidamente un mapa del sitio para su sitio web. Puede enviarlo a Google o Bing. incluso generar un mapa del sitio para un sitio web ASP NET MVC

Esta es una descripción general del informe de análisis para el sitio web "Superexpert"

Tenga en cuenta que el "Sueprexpert" " el sitio web existe Hay muchos problemas, como un hipervínculo a una página que ha caducado. Puede consultar más detalladamente los detalles de estos problemas para averiguar dónde ocurrieron y las páginas específicas.

LinqPad

Si su sitio web ASP NET necesita acceder a una base de datos, entonces debe usar LINQ to Entities, Entity Framework.

El uso de LINQ convertirá algunas consultas mágicas escritas en C# en consultas SQL. Si no tiene cuidado al escribir consultas LINQ, puede crear sin darse cuenta un sitio web con un rendimiento muy deficiente.

LinqPad (el sitio oficial de LinqPad) es. una herramienta gratuita que le permite experimentar con sus consultas LINQ. Incluso es compatible con Microsoft SQL CE y Azure.

Puede usar LinqPad para ejecutar una consulta LINQ to Entities y luego ver los resultados. para ver las declaraciones SQL ejecutadas en esa base de datos

NET Reflector

Utilizo NET Reflector NET Reflector todos los días. Le permite desmontar un ensamblaje en C#. o código VB NET Cuando no tenga el código fuente real, puede usar NET Reflector para ver el "código fuente" de un ensamblaje. Puede descargar NET Reflector de forma gratuita desde el sitio web de Redgate. > Utilizo principalmente NET Reflector para ayudarme a descubrir cómo funciona el código internamente. Por ejemplo, para comprender mejor cómo funciona el asistente de imagen MVC, uso NET Reflector para analizar Sprite y Image Optimization Framework. Esto es parte del código de desmontaje. de la clase auxiliar de imagen

Resumen lishixinzhi/Article/program/net/201311/14298