مطالب
Gulp #5
در مقالات قبلی به طور کامل با گالپ آشنا شدیم و گفتیم که میتواند ما را در بهینه سازی ورک فلویمان کمک کند. در این قسمت یاد خواهیم گرفت که چگونه تجربهی کاربری بهتری را از سرعت بارگذاری سایتمان ایجاد کنیم.
افزایش کارآیی Performance وب با گالپ
برای اینکه بفهمیم چه کارهایی میتواند سایت یا اپلیکیشن ما را کاراتر کند، از Developer tools با زدن Ctrl+Shifi+I درون گوگل کروم، کار خود را شروع میکنیم. به برگهی Audits میرویم و دکمهی Run را با تنظیمات پیش فرض میزنیم. نتایج آن بعد از اندکی صبر، برای من به صورت شکل زیر است:
ما قصد داریم بدانیم گالپ چه ابزاهایی را برای راه حلهای داده شده توسط مرورگر دارد؟
۱− کنار هم قرار دادن و فشرده کردن فایلهای جاوا اسکریپت
پلاگینهای گالپ برای اینکار، gulp-concat و gulp-uglify هستند. آنها را در مسیر ریشهی پروژه نصب میکنیم.
npm install --save-dev gulp-uglify gulp-concat
بعد از نصب، فایل gulpfile.js را به صورت زیر ویرایش و تسک js را به آن اضافه میکنیم.
// first load all required js files // concat them in to script.min.js // and minify it. gulp.task('js', function() { return gulp.src([ config.bowerDir + '/jquery/dist/jquery.min.js', // این فایل وابستگی فایلهای زیر است config.bowerDir + '/materialize/dist/js/materialize.min.js', './resources/js/app.js' ]) .pipe(concat('script.min.js')) .pipe(uglify()) .pipe(size()) .pipe(gulp.dest('./public/js')); });
فشرده کردن جاوا اسکریپت، حجم فایلها را ۳۰ تا ۹۰ درصد کاهش میدهد.
۲− حذف سکلتورهای بدون استفاده css
همانگونه که در عکس اول آمده، ۹۳ درصد سلکتورها در این صفحه بلا استفاده هستند! و این یعنی کاهش فوق العاده زیاد حجم فایل فشرده شده css. به طور معمول، توسعه دهندگان ۸۵ درصد حجم فایل css خود را میتوانند با این کار کاهش دهند (البته بیشتر این اتفاق هنگام استفاده از فریک ورکهایی مانند bootstrap,... میافتد) برای این کار از پلاگین gulp-uncss استفاده میکنیم. نصب:
npm install gulp-uncss --save-dev
gulp.task('css', function() { return sass(config.sassPath + '/style.scss', { style: 'compressed', loadPath: [ './resources/sass', config.bowerDir + '/materialize/sass' ] }) .on('error', util.log) .pipe(size()) .pipe(uncss({ html: ['./index.html', './posts.html'] })) .pipe(gulp.dest('./public/css')) .pipe(size()) .pipe(connect.reload()); });
نتیجه فوق العاده است! ۸۷ درصد کاهش حجم css! اما ممکن است بعضی از استایلهای شما توسط javascript به صفحه تزریق شوند. در این صورت نباید سکلتورهای لازم را حذف کرد و آنها را داخل آرایهی ignore قرار میدهیم. برای این منظور، تسک بالا را به صورت زیر به روز رسانی میکنیم.
gulp.task('css', function() { return sass(config.sassPath + '/style.scss', { style: 'compressed', loadPath: [ './resources/sass', config.bowerDir + '/materialize/sass' ] }) .on('error', util.log) .pipe(size()) .pipe(uncss({ html: ['./index.html', './posts.html'], timeout : 2000, // wait for load js files ignore: [ ".waves-ripple ", ".drag-target", "#sidenav-overlay", ".waves-effect", ".waves-effect .waves-ripple", ".waves-effect.waves-pinck .waves-ripple", ".waves-block.waves-light" ] })) .pipe(minifyCss()) .pipe(size()) .pipe(gulp.dest('./public/css')) .pipe(connect.reload()); });
اشتراکها
انتشار SQL Server 2016 CTP 3.1
New In-Memory OLTP improvements in CTP3.1 include:
- Unique indexes in memory-optimized tables, to complement the support for unique constraints that was released in CTP3
- LOB data types varchar(max), nvarchar(max), and varbinary(max) in memory-optimized tables and natively compiled modules
- Indexes with NULLable key columns in memory-optimized tables
Syntax inputdate AT TIME ZONE timezone.
- Inputdate: An expression that can be resolved to a smalldatetime, datetime, datetime2, or datetimeoffset value.
- Timezone: Name of the destination time zone in standard format as enumerated by Windows. Available time zones can be found by querying sys.time_zone_info.
SQL Server Analysis Services (SSAS) updates allow upgrading your existing models to 1200 compatibility level and a JSON editor for SSDT;
اشتراکها
WebStorm 2019.1.1 منتشر شد
اشتراکها
SQL Server 2022 CTP 2.1 منتشر شد
اشتراکها
Management Studio 18.2 منتشر شد
اشتراکها